selectRoleCode(val) { const allValues = this.role.map(item => { return item.roleCode }) // 用來儲存上一次選擇的值,可進行對比 const oldVal = this.oldChooseData.length > 0 ? this.oldChooseData : [] // 若選擇全部 if (val.includes('00000000')) { this.chooseData = allValues } // 取消全部選中, 上次有, 當前沒有, 表示取消全選 if (oldVal.includes('00000000') && !val.includes('00000000')) { this.chooseData = [] } // 點擊非全部選中,需要排除全部選中 以及 當前點擊的選項 // 新老數據都有全部選中 if (oldVal.includes('00000000') && val.includes('00000000')) { const index = val.indexOf('00000000') val.splice(index, 1) // 排除全選選項 this.chooseData = val } if (!val.includes('00000000') && !oldVal.includes('00000000')) { this.chooseData = val } // 全選未選,但是其他選項都全部選上了,則全選選上 if (!oldVal.includes('00000000') && !val.includes('00000000')) { if (val.length === allValues.length - 1) { this.chooseData = ['00000000'].concat(val) } } // 儲存當前選擇的最后結果 作為下次的老數據 this.oldChooseData = this.chooseData this.dashboard.roleCode = [...this.oldChooseData] },
<el-select v-model="dashboard.roleCode" @change="selectRoleCode" multiple collapse-tags placeholder="請選擇角色名稱" style="width: 145px;" size="mini"> <el-option v-for="item in role" :key="item.id" :label="item.roleName" :value="item.roleCode"> </el-option> </el-select>