前提:需下有element ui
直接上代码!
<template>
<div>
<el-select multiple v-model="activeForm.list1_Ids" filterable placeholder="请选择">
<div style="text-align: right;cursor: pointer;color: #1A73E8;padding-right:5% " >
<span @click="searchAllChange(true)" style="font-size: 12px" v-if="list1.length>0">全选</span>
<span @click="searchAllChange(false)" style="padding: 0 2%;font-size: 12px" v-if="activeForm.list1_Ids.length>0">清空</span>
</div>
<el-option v-for="item in list1" :key="item.Key" :label="item.Key" :value="item.Value" > </el-option>
</el-select>
</div>
</template>
<script>
export default {
name: 'App',
data() {
return {
activeForm:{
list1_Ids:[], //列表1选择的数据
},
list1:[
{Key:'list1',Value:1},
{Key:'list2',Value:2},
{Key:'list3',Value:3},
],
}
},
methods:{
searchAllChange(val){
if(val){
this.activeForm.list1_Ids = this.list1.map(item=>item.Value)
}else{
this.activeForm.list1_Ids = []
}
},
}
}
保存看效果!