APIbeta

Switch

Introduce

props

名称 描述 类型 可选值 默认值
value / v-model 绑定值; 等同于 checked boolean — —
checked 当前是否勾选 boolean — false
disabled 是否禁用 boolean或’disabled’ — false

events

名称 描述 回调参数
change(checked):void 选中状态改变事件 更新后的值

example

示例代码.

1
2
<bp-switch v-model="checked" >normal</bp-switch>
<bp-switch disabled="disabled" >disabled</bp-switch>

See the Pen wvadGGQ by brainpoint (@brainpoint) on CodePen.

自定义主题

样式结构

组件的样式结构如下:

1
2
3
4
5
6
7
8
.bp-switch {
  /* checkbox input部分 */
  .bp-switch__input {
  }
  /* label部分 */
  .bp-switch__label {
  }
}

scss样式文件存放在@bpui/switch/style 目录下, 可以复制修改以定制主题