我想在改變v-switch時檢查一個復選框的串列。 我的情況是這樣的：
這是一個開關組件，如果selectAll為真，我想檢查所有的復選框：
這是一個開關組件。
<v-switch style="padding-right: 15px;" v-model="selectAll" @change="handleChanging">
</v-switch>。
下面是串列，每個專案之前都有一個復選框：
<v-list-item v-for="(item, index) in itemsEducators" :key="index" >
<v-list-item-action>>。
<v-checkbox :key=" item. title" :input-value="item.checked"> </v-checkbox>
</v-list-item-action>/span>
<v-list-item-content>
<v-list-item-title>{{ item.title }}</v-list-item-title>
<v-list-item-subtitle>{{ item.institution }}. </v-list-item-subtitle>{ item.institution }}。
</v-list-item-content>>
</v-list-item>
這里有一個js函式：
methods: {
handleChanging（） {
if (this.selectAll ==true) {
//這里我想檢查所有復選框。
} else {
//here to uncheck all !
}
}
}
uj5u.com熱心網友回復：
你可以這樣做：
handleChanging（）{
if (this.selectAll ==true) {
this.itemsEducators. forEach(x => x.checked =true)。
} else {
this.itemsEducators。 forEach(x => x.checked =false)。
}
uj5u.com熱心網友回復：
嘗試像下面這樣 :
new Vue（{
el: '#demo',
data（） {
return {
itemsEducators: [
{title: 'title 1', checked: false, institution: '1'}。
{title: 'title 2', checked: false, institution: '1'}。
{title: 'title 3', checked: true, institution: '1'}。
{title: 'title 4', checked: false, institution: '1'}。
],
all: false。
}
},
methods: {
handleChanging（） {
this.itemsEducators = this。 itemsEducators.map(i => {
i.checked =this.all
return i
})
},
setCheck（） {
this.itemsEducators。 find(c => c.checked ==false) ? this.all = false : this。 all = true。
}
})<script src="https://cdnjs. cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>/span>
<div id="demo">/span>
<p>所有</p>/span>
<input type="checkbox"/span> style="padding-right: 15px; margin-bottom: 2em;" v-model="all" @change="handleChanging" />
<ul style="display: flex; list-style: none;">
<li v-for=" (item, index) in itemsEducators" : key="index" style="margin-right: 2em;">
<input type="checkbox" :key="item. title" v-model="item.checked" @change="setCheck" />
<p>{{ item.title }}</p>
<li>/span>
</ul>
</div>/span>轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/310046.html
標籤：
下一篇：LINQ分組到同一收件人