Blazor RadioGroup概述
的Blazor RadioGroup组件允许用户从单选按钮列表中的预定义选项集中选择一个选项。无线电组是根据Telerik设计的主题.你也可以选择布局顺序而且标签的位置.
RadioGroup组件是为Blazor的Telerik UI,一个具有100个本地组件的专业级UI库,用于构建现代和功能丰富的应用程序。想要试用它,请注册一个30天的免费试用。
创建Blazor RadioGroup
添加
< TelerikRadioGroup >
标记到Razor文件。填充它
数据
属性中要在列表中添加的项的集合。设置
价值
参数。它支持单向和双向绑定。设置
文本框
而且ValueField
属性,以指向模型的相应属性。
单选按钮组基本配置。
选择性别:@(ChosenGender == 0 ?"no selection yet": ChosenGender.ToString())
@code{TelerikRadioGroup<性别模型,int?> RadioGroupRef {get;设置;} int chosensex {get;设置;}列表<性别模型>性别选项{get;设置;} = new List {new GenderModel {GenderId = 1, GenderText = "Female"}, new GenderModel {GenderId = 2, GenderText = "Male"}, new GenderModel {GenderId = 3, GenderText = "Other"}, new GenderModel {GenderId = 4, GenderText = "Prefer not to say"},}; public class GenderModel { public int GenderId { get; set; } public string GenderText { get; set; } } }
数据绑定
Blazor RadioGroup支持到原语类型和模型的数据绑定。阅读有关Blazor RadioGroup数据绑定的更多信息.
布局
RadioGroup组件提供了两种呈现选项列表的方法—在垂直或者在水平时尚。阅读更多关于Blazor RadioGroup布局.
标签的位置
RadioGroup组件提供了两种呈现单选按钮标签的方法-之前或后单选按钮。阅读更多关于Blazor RadioGroup标签位置的信息.
外观设置
Blazor RadioGroup提供了一个大小
参数自定义单选按钮尺寸。阅读有关Blazor RadioGroup外观设置的更多信息.
事件
Blazor RadioGroup触发模糊和值更改事件以响应用户操作。阅读更多关于Blazor RadioGroup事件.
RadioGroup参数
Blazor RadioGroup提供了各种参数来配置组件。还要检查RadioGroup公共API.
参数 | 类型及默认值 | 描述 |
---|---|---|
类 |
字符串 |
主包装元素的自定义CSS类,它是< ul类= " k-radio-list " > . |
启用 |
保龄球 ( 真正的 ) |
组件是否启用。 |
Id |
字符串 |
的id 主包装元素的属性。 |
LabelPosition |
RadioGroupLabelPosition 枚举( 后 ) |
标签呈现在单选按钮本身之后还是之前。 |
布局 |
RadioGroupLayout 枚举( 垂直 ) |
按钮是垂直呈现还是水平呈现。 |
的名字 |
字符串 |
设置一个的名字 属性的< input type = "电台”> 元素。 |
TItem |
对象 |
组件绑定到的模型的类型。如果你不能提供数据 或价值 .确定引用对象的类型。 |
TValue |
对象 |
来自组件绑定到的模型的值字段的类型。如果你不能提供数据 或价值 .确定引用对象的类型。 |
文本框 |
字符串 ( 文本 ) |
将显示给用户的模型中字段的名称。 |
ValueField |
字符串 ( 价值 ) |
来自将填充底层的模型的字段的名称价值 . |
价值 |
对象 |
组件的值。支持单向和双向绑定。如果价值 匹配ValueField 值,则数据中的相应项将被预先选中。 |
看到输入验证文章了解更多细节。