组件/ToggleButton

Blazor ToggleButton概述

的信息Blazor ToggleButton组件以及它的核心特征。

ToggleButton组件可以有一个选择状态，这是与常规的按钮．两状态样式取决于选择主题．ToggleButton也提供事件，声明式外观定制可以筑巢图标．

《Blazor Ninja》图像的teleerik UI

ToggleButton组件是《Blazor》的teleerik UI，一个专业级的UI库，有100个本地组件，用于构建现代和功能丰富的应用程序。要想尝试一下，注册一个30天的免费试用。

免费下载试用版

创建Blazor切换按钮

  1. 使用< TelerikToggleButton >标签。
  2. 设置选择参数为a保龄球财产。使用双向绑定或单向绑定SelectedChanged处理程序．
  3. 处理OnClick事件．
  4. (可选)添加图标或者配置外观．

基本的teleerik ToggleButton

选中:@IsSelected  
 @result 
 @code {bool IsSelected {get;设置;} = true;字符串结果{get;设置;} async任务OnToggleButtonClick(){字符串currentState = IsSelected ?on: off;result = $"用户点击了{currentState}状态";}}

事件

切换按钮公开单击和所选状态更改的事件。欲知详情，请浏览切换按钮事件文章．

图标

切换按钮提供了一种内置的呈现方式Telerik字体图标，自定义字体图标，图像或精灵．

外观

切换按钮提供了几个参数来控制其造型和外观，包括背景颜色，形状，圆角和填充．

ToggleButton参数

下表列出了切换按钮参数，这些参数在其他地方没有讨论。检查ToggleButton API参考获取属性、方法和事件的完整列表。

参数 类型和默认值 描述
AriaLabel 字符串 呈现一个aria-labelHTML属性添加到按钮元素。
类 字符串 控件呈现额外的CSS类<按钮类= " k-button " >元素。使用它来应用自定义样式或覆盖主题．看到自定义样式在下面。
启用 保龄球
（真正的）		 确定按钮是否已启用并接受单击。
Id 字符串 呈现一个idHTML属性添加到按钮元素。
TabIndex int 呈现tabindex属性。
标题 字符串 呈现标题属性。

自定义样式

可以通过控件将自定义样式应用到按钮上类参数。的基础上自定义样式选择状态。

为按钮设置CSS类并更改其外观

切换按钮 
         
          
         
        改进这篇文章
Baidu
map