Blazor复选框概述

Blazor复选框组件允许您向应用程序添加更多可自定义复选框。它维护了标准HTML复选框的行为,并提供了选中的、未选中的和不确定的州。

Telerik UI的Blazor忍者形象

的复选框组件的一部分Blazor的Telerik UI,一个专业级的UI库,包含100个本地组件,用于构建现代和功能丰富的应用程序。想要试用它,可以注册一个30天的免费试用期。

创建Blazor复选框

  1. 添加TelerikCheckBox标记到Razor文件。

  2. 设置价值的参数。保龄球对象。它支持单向和双向绑定。

  3. (可选)设置Id参数来附加<标识>转到复选框。

使用双向数据绑定的Telerik CheckBox的基本设置。

@* TelerikCheckBox组件的基本设置*@   @code {private bool isSelected {get;设置;}}

不确定的状态

除了基本的检查而且无节制的状态,Blazor复选框有第三个状态-不确定的阅读更多关于Blazor复选框不确定状态的信息

外观

Checkbox组件提供大小和边框设置来控制其外观。阅读更多关于Blazor复选框外观设置

事件

Blazor复选框触发值更改、焦点和状态更改事件,您可以处理这些事件并进一步自定义其行为。阅读更多关于Blazor复选框事件

复选框的参数

Blazor复选框提供了各种参数,允许您配置组件:

参数 类型 描述
字符串 对象呈现自定义CSS类<输入class = " k-checkbox " >元素。
启用 保龄球 组件是否启用。
Id 字符串 渲染为id属性上的<输入/ >元素,所以你可以附加一个<标签= " " >到它。
不确定的 保龄球 将复选框置于其第三个状态-不确定。看到不确定的状态文章获取更多信息和示例。
TabIndex Nullable < int > tabindex属性呈现在复选框上。
价值 保龄球 映射到检查属性的正常HTML复选框。

另请参阅输入验证篇文章。

常见的例子

展示“我同意条款和条件”基本场景的示例。

@if (hasAgreed) {
感谢您同意我们的条款和条件!
} else {

我爱你,我爱你。我爱你,我爱你,我爱你,我爱你。现在,我遇到了狮子座。毛头毛,毛头毛,毛头毛,土的时间。双截棍,牛油和牛油,发酵酱。佩伦斯克和精英,索代尔尼伯克,福奇布斯。颞前庭。最重要的动作,最有效的动作。紫花魔芋。 Vestibulum ex arcu, molestie sed quam vulputate, aliquet cursus lectus. Aenean sollicitudin condimentum fringilla. Integer arcu justo, sollicitudin ut libero ut, posuere finibus sapien. Suspendisse hendrerit convallis urna. Donec eu sodales dui, et consequat massa. Integer vitae euismod dui, id rhoncus tellus. Ut luctus leo eget sapien eleifend facilisis. Duis sed maximus tortor. Ut nunc nibh, pulvinar a enim eget, mattis sagittis sem. Mauris odio nibh, aliquet a erat sit amet.

} @code { private bool hasAgreed { get; set; } }

下一个步骤

另请参阅

在本文中
Baidu
map