Switch

作为行内表单组件，Switch必须和Group一起使用。

Props

名字 类型 默认 描述
value Boolean false 表单值,双向绑定
title String 无 cell标题
disabled Boolean false 是否禁止操作
inline-desc String 无 副标题

Events

名字 参数 描述
on-change (value) 值变化时触发

直接值

template

<group>
  <switch title="Switch" :value=true></switch>
  <switch title="Switch" :value=false></switch>
</group>

双向绑定

template

<group>
  <switch :title="'双向绑定:值为' + value1" :value.sync="value1"></switch>
  <switch :title="'双向绑定:值为' + value1" :value.sync="value1"></switch>
</group>

script

export default {
  data: {
    value1: true
  }
}

disabled 设置不可更改

template

<group>
  <switch title="不可更改" :value=true disabled></switch>
  <switch title="不可更改" :value=false disabled></switch>
</group>

title支持html

template

<group>
  <switch title="<span style='color:red'>红色文字</span>" :value=true></switch>
</group>

on-change 事件

template

<group>
  <switch title="监听事件" :value=true @on-change="change"></switch>
</group>

script

export default {
  methods: {
    change: function (val) {
      console.log('change', val)
    }
  }
}

results matching ""

    No results matching ""