W3Cschool
恭喜您成為首批注冊用戶
獲得88經(jīng)驗值獎勵
SwitchCell 組件將在 3.0 版本中廢棄,請直接使用 Cell 和 Switch 組件代替
import Vue from 'vue';
import { SwitchCell } from 'vant';
Vue.use(SwitchCell);
<van-cell-group>
<van-switch-cell v-model="checked" title="標題" />
</van-cell-group>
export default {
data() {
return {
checked: true
}
}
}
通過disabled屬性可以將組件設(shè)置為禁用狀態(tài)
<van-cell-group>
<van-switch-cell v-model="checked" disabled title="標題" />
</van-cell-group>
通過loading屬性可以將組件設(shè)置為加載狀態(tài)
<van-cell-group>
<van-switch-cell v-model="checked" loading title="標題" />
</van-cell-group>
參數(shù) | 說明 | 類型 | 默認值 |
---|---|---|---|
v-model | 開關(guān)狀態(tài) | any | false |
title | 左側(cè)標題 | string | '' |
border | 是否展示單元格內(nèi)邊框 | boolean | true |
cell-size | 單元格大小,可選值為 large | string | - |
loading | 是否為加載狀態(tài) | boolean | false |
disabled | 是否為禁用狀態(tài) | boolean | false |
size | 開關(guān)尺寸 | number | string | 24px |
active-color | 開關(guān)時的背景色 | string | #1989fa |
inactive-color | 開關(guān)時的背景色 | string | white |
active-value | 打開時的值 | any | true |
inactive-value | 關(guān)閉時的值 | any | false |
事件名 | 說明 | 回調(diào)參數(shù) |
---|---|---|
change | 開關(guān)狀態(tài)切換回調(diào) | checked: 是否選中開關(guān) |
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網(wǎng)安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯(lián)系方式:
更多建議: