vue 實(shí)現(xiàn)單選框設(shè)置默認(rèn)選中值
vue中單選框的默認(rèn)選中不同于傳統(tǒng)方式設(shè)置checked,是通過(guò)在data中設(shè)置vulue來(lái)實(shí)現(xiàn)的
html部分是通過(guò)v-for取的后臺(tái)的數(shù)據(jù)
<li v-for="(value,i) in addList" :key="value.id"> <input class="radio" type="radio" name="radios" :value="i" v-model="radio" /> </li>
生成后的代碼就是
<li> <input class="radio" type="radio" name="radios" value="0" v-model="radio" /> <input class="radio" type="radio" name="radios" value="1" v-model="radio" /> <input class="radio" type="radio" name="radios" value="2" v-model="radio" /> </li>
js部分(只需要將v-model的data值設(shè)置為想要默認(rèn)選中的value值即可)
//在data中設(shè)置默認(rèn)選中第一個(gè) radio:'0',
以上這篇vue 實(shí)現(xiàn)單選框設(shè)置默認(rèn)選中值就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
element 穿梭框性能優(yōu)化的實(shí)現(xiàn)
本文主要介紹了element 穿梭框性能優(yōu)化,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-10-10vue中監(jiān)聽(tīng)scroll事件失效的問(wèn)題及解決
這篇文章主要介紹了vue中監(jiān)聽(tīng)scroll事件失效的問(wèn)題及解決,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-09-09Vue.js3.2的vnode部分優(yōu)化升級(jí)使用示例詳解
這篇文章主要為大家介紹了Vue.js3.2的vnode部分優(yōu)化升級(jí)使用示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07vue刷新子組件、重置組件以及重新加載子組件項(xiàng)目實(shí)戰(zhàn)記錄
在vue開(kāi)發(fā)中出于各種目的,我們常常需要讓組件重新加載渲染,這篇文章主要給大家介紹了關(guān)于vue刷新子組件、重置組件以及重新加載子組件的相關(guān)資料,需要的朋友可以參考下2023-12-12在vue項(xiàng)目中引用Antv G2,以餅圖為例講解
這篇文章主要介紹了在vue項(xiàng)目中引用Antv G2,以餅圖為例講解,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-10-10關(guān)于vue3.0中的this.$router.replace({ path: ''/''})刷新無(wú)效果問(wèn)題
這篇文章主要介紹了關(guān)于vue3.0中的this.$router.replace({ path: '/'})刷新無(wú)效果問(wèn)題,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01