element中el-switch的v-model自定義值的實(shí)現(xiàn)
更新時(shí)間：2023年11月29日 09:32:01 作者：老馬甲
在el-switch中設(shè)置active-value和inactive-value屬性,接受Boolean, String或Number類型的值,本文就來(lái)介紹一下element中el-switch的v-model自定義值的實(shí)現(xiàn),感興趣的可以了解一下
一、問(wèn)題
element中的el-switch的值默認(rèn)都是true或false，但是有些時(shí)候后端接口該字段可能是0或者1，如果說(shuō)再轉(zhuǎn)換一次值，那就有點(diǎn)太費(fèi)力了。如下所示：
<template>
<el-switch
inactive-text="否"
active-text="是"
v-model="status"
@change="changeSwitch"
/>
</template>
<script>
export default {
data() {
return {
status: false
}
},
methods: {
changeSwitch(e) {
console.info(e)
}
}
}
</script>
二、解決
在el-switch中設(shè)置active-value和inactive-value屬性，接受Boolean, String或Number類型的值
<el-switch
inactive-text="否"
active-text="是"
active-value="1"
inactive-value="0"
v-model="status"
/>
三、官方文檔
到此這篇關(guān)于element中el-switch的v-model自定義值的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)element el-switch v-model自定義值內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
網(wǎng)頁(yè)從彈窗頁(yè)面單選框傳值至父頁(yè)面代碼分享
最近有項(xiàng)目需求，需要在加入新機(jī)構(gòu)的時(shí)候，需要選擇它的上級(jí)機(jī)構(gòu)，下面把代碼整理，分享給大家，需要的朋友可以參考下2015-09-09
嚴(yán)格模式就是使JS編碼更加規(guī)范化的模式,消除Javascript語(yǔ)法的一些不合理、不嚴(yán)謹(jǐn)之處，減少一些怪異行為。下面通過(guò)代碼相結(jié)合的形式給大家介紹js中的嚴(yán)格模式，感興趣的朋友一起看看吧2018-06-06
基于javascript html5實(shí)現(xiàn)多文件上傳
這篇文章主要為大家詳細(xì)介紹了基于javascript html5實(shí)現(xiàn)多文件上傳的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-03-03
Javascript的常規(guī)數(shù)組和關(guān)聯(lián)數(shù)組對(duì)比小結(jié)
關(guān)聯(lián)數(shù)組雖然可以用字符串作下標(biāo)，但是這個(gè)下標(biāo)是不支持參數(shù)傳值的，換言之，你需要什么就取什么，聽(tīng)起來(lái)很智能，實(shí)際上你取值仍然需要你手動(dòng)去寫(xiě)下標(biāo)的2012-05-05
簡(jiǎn)單實(shí)現(xiàn)JS計(jì)算器功能
這篇文章主要教大家簡(jiǎn)單實(shí)現(xiàn)JS計(jì)算器功能,實(shí)現(xiàn)小數(shù)點(diǎn)校驗(yàn)，重復(fù)計(jì)算，以及大量更符合用戶體驗(yàn)的操作，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-12-12
TypeScript裝飾器的作用、結(jié)構(gòu)、類型及其應(yīng)用場(chǎng)景（代碼示例）
文章介紹了裝飾器的作用、結(jié)構(gòu)、類型及其應(yīng)用場(chǎng)景,裝飾器是一種特殊類型的聲明,可以附加到類、方法、訪問(wèn)符、屬性或參數(shù)上,通過(guò)在不改變?cè)写a的情況下擴(kuò)展功能,文章還提供了裝飾器的具體實(shí)現(xiàn)示例,包括類裝飾器、方法裝飾器、參數(shù)裝飾器和屬性裝飾器2026-02-02
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)收貨地址左滑刪除，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-07-07
js 判斷字符串中是否包含某個(gè)字符串的實(shí)現(xiàn)代碼
工作中經(jīng)常會(huì)使用到判斷一個(gè)字符串是否包含某一個(gè)字符串，因此總結(jié)一下幾個(gè)方法,需要的朋友可以參考下2023-03-03
JavaScript可折疊區(qū)域?qū)崿F(xiàn)代碼
可折疊區(qū)域的基本思想：通過(guò)點(diǎn)擊某個(gè)地方來(lái)顯示或隱藏屏幕中的某個(gè)區(qū)域。2010-10-10
js實(shí)現(xiàn)tab選項(xiàng)卡函數(shù)代碼
js實(shí)現(xiàn)tab選項(xiàng)卡函數(shù)代碼，需要的朋友可以參考下，這樣的代碼也是比較常用的，相當(dāng)原理也比較簡(jiǎn)單。2010-04-04