复选框可以单独使用，和可以包含在CheckBoxes中多选使用
复选框可以单独使用，和可以包含在CheckBoxes中多选使用
<Content>
<Field>
<CheckBox TValue="string" Checked="true">
Checkbox
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" Color="Color.Success" Checked="true">
Checkbox - success
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" Color="Color.Warning" Checked="true">
Checkbox - warning
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" Color="Color.Danger" Checked="true">
Checkbox - danger
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" Color="Color.Info" Checked="true">
Checkbox - info
</CheckBox>
</Field>
<Notification Color="Color.Dark">
<Field>
<CheckBox TValue="string" Color="Color.White" Checked="true">
Checkbox - white
</CheckBox>
</Field>
</Notification>
</Content><Content>
<Field>
<CheckBox TValue="string" IsSmall Checked="true">
Checkbox - small
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" Checked="true">
Checkbox
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" IsMedium Checked="true">
Checkbox - medium
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" IsLarge Checked="true">
Checkbox - large
</CheckBox>
</Field>
</Content><Content>
<Field>
<CheckBox TValue="string" IsCircle
Checked="true">
Checkbox - Circle
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" IsBlock
Color="Color.Warning" Checked="true">
Checkbox - block
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" HasNoBorder
Color="Color.Danger" Checked="true">
Checkbox - noborder
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" HasBackgroundColor
Color="Color.Success" Checked="true">
Checkbox - background
</CheckBox>
</Field>
<Field>
<CheckBox TValue="string" IsRTL
Color="Color.Primary" Checked="true">
Checkbox - RTL
</CheckBox>
</Field>
</Content>单个复选框使用@bind-Checked, 绑定值必须是bool，因为是泛型，需要随便设置一个TValue
<Content>
<Field>
<Label>Val的值：</Label>
<Control>
<Input Value="val" IsStatic />
</Control>
</Field>
<Field>
<Label>复选框：</Label>
<Control>
<CheckBox indeterminate @bind-Checked="val" TValue="string">
I agree to the <a href="#">terms and conditions</a>
</CheckBox>
</Control>
</Field>
<Field>
<Control>
<Button Color="Color.Info" @onclick="setNewValue">反选</Button>
</Control>
</Field>
</Content>
@code{
bool val;
void setNewValue()
{
val=!val;
}
}
复选框列表使用在CheckBoxes上使用@bind-Checked, CheckBox需要设置好Value
CheckBoxes是空标签，只需要把CheckBox放在其中即可，样式需要自己控制
<Content>
<Field>
<Label>Val的值：</Label>
<Control>
<Input Value="string.Join(',',val)" IsStatic />
</Control>
</Field>
<Field>
<Label>复选框列表1：</Label>
<Control>
<CheckBoxes @bind-Values="val">
@for (var i = 0; i < 8; i++)
{
var newi=i;
<CheckBox Color="Color.Info" Value="newi">
name@(newi)
</CheckBox>
}
</CheckBoxes>
</Control>
</Field>
<Field>
<Label>复选框列表2：</Label>
<Control>
<CheckBoxes @bind-Values="val">
@for (var i = 0; i < 8; i++)
{
var newi=i;
<CheckBox Color="Color.Info" Value="newi">
name@(newi)
</CheckBox>
}
</CheckBoxes>
</Control>
</Field>
</Content>
@code{
HashSet<int> val = new HashSet<int>() { 1, 2 };
}
文档