vue3+elementPlus:下拉选择框同时获取到选中的id和数据
vue3+elementPlus:下拉选择框同时获取到选中的id和数据,在里绑定@click事件。
·
//在<el-option>里绑定@click事件
//html
<el-select
value-key="id"
v-model="filterText"
multiple
>
<el-option
v-for="item in Lists"
:key="item.id"
:label="item.name"
:value="item"
@click.native="changeGateway(item)"
/>
</el-select>
//js
const changeGateway=(val)=>{
if (val.state ===0) {//如果state 为0则按钮变为1
val.state =1
// console.log(val.state ,'点击显示');
}else if(val.state ===1){//如果state 为1则按钮变为0
val.state =0
// console.log(val.state ,"隐藏");
}//接口
update({
id:val.id,
state :val.state
}).then((res)=>{
Datas=JSON.stringify(res.data.data)
// console.log(store.state.clickHeaderDatas);
getlist() //此封装函数里绑定了v-model的回显
})
}
const getlist = () => {
//接口
list({}).then((res) => {
let showArr = res.data.data.filter((item)=>{
return String(item.state)== 1;
})
// console.log(showArr,"showArr");//过滤掉为1的数据
Lists = res.data.data
res.data.data?.map((v)=>{
//如果state为1则显示,0隐藏
if (v.state==1) {
filterText = showArr //显示选择器v-model
}
})
})
}
作者上一篇文章,
更多推荐
已为社区贡献7条内容
所有评论(0)