样式没有多做调整,想要什么样式自己可以添加css
<!-- vue循环实现多个下拉菜单 -->
<div @click="hideArr">
<ul class="con_ul">
<li v-for="(testArr,t) in testArrs" :key=t @click.stop="selLi=t"
style="border:1px solid red;width:100px;">
<span>{{testArr.title}} ></span>
<ul class="con_small" v-if="selLi==t">
<li v-for="(con,c) in testArr.cons" :key=c @click.stop="option(t,c)">
{{con}}
</li>
</ul>
</li>
</ul>
</div>
data:{
return:{
selLi: -1,
testArrs: [
{
title: '人数',
cons: ['10人以下', '10~20人', '20~30人', '30~50人', '50人以上']
},
{
title: '年龄',
cons: ['5岁以下', '5~10岁', '10~20岁', '20岁以上']
},
{
title: '行业领域',
cons: ['金融', '地产', '工程', '建筑', '服装', '机械', '食品', '环保',
'餐饮', '科研机构', '互联网', '其他']
}
],
}
}
metods:{
//
hideArr() {
this.selLi = -1;
},
option(t, c) {
this.selLi = -1;
this.testArrs[t].title = this.testArrs[t].cons[c];
},
}