vue 不使用select,实现下拉框功能
html部分:(v-for循环出的结构)
<div >
      <p @click="clickSize (item, index)">{{item.name}}</p>   
      <transition name="opacityLeave">
           <div class="condition-list" v-show="isShow && index == i">
                <div class="size-wrap" v-if="item.RingSize">
                    <p class="size" :class="{'active':item1.active}" :key="index1" v-for="(item1, index1) in item.RingSize"  @click="getSize (item, item1) ">{{item1.AttrValueName}}</p>
               </div>
           </div>
      </transition>
</div>


js部分:

data() {
    return {
      isShow: false,
      i: -1
    };
  },
//实现点击哪个下拉框显示
     clickSize (item, index) {
        this.i = index;
        this.isShow = !this.isShow;
    },
//实现选取下拉值
    getSize (item, item1) {
        this.item.name = item1.AttrValueName;
        this.isShow = !this.isShow;
    },


阅读更多
个人分类: vue 实现下拉功能
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

vue 不使用select,实现下拉框功能

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭