Select element inside dropdown menu issue

十年热恋 提交于 2021-01-29 05:19:45

问题


I am currently experimenting in Element UI a beautiful VueJS frame for ui. I am having issue when putting an select element inside a dropdown menu because when I select an item inside the select element it will close the dropdown also.

How should I make the dropdown stay whenever I select an item in select element?

Here is the sample demo. fiddle https://jsfiddle.net/vy70ogbz/


回答1:


Why dont you use a menu to achieve this. I find it is more flexible, you can use the menu-trigger="click" attribute to toggle the menu only when clicked. like this

 <el-menu
      :default-active="activeIndex"
      mode="horizontal"
      menu-trigger="click"
      @select="handleSelect">

      <el-submenu
        class="sub-menu-more">
        <template slot="title">
          <b>Click to dropdown</b>
        </template>
        <el-menu-item
          index="1">
          <span >Team</span>
        </el-menu-item>
        <el-menu-item
          index="2">
          <span >Product</span>
        </el-menu-item>
        <el-menu-item
          index="3">
          <span >item</span>
        </el-menu-item>
        <el-menu-item
          index="4">
         <el-select v-model="value" placeholder="Select">
        <el-option
         :label="'test1'"
         :value="'test1'">
        </el-option>
        <el-option
         :label="'test1'"
         :value="'test1'">
        </el-option>
        <el-option
          :label="'test1'"
          :value="'test1'">
        </el-option>
      </el-select>
        </el-menu-item>
      </el-submenu>
   </el-menu>

see fiddle



来源:https://stackoverflow.com/questions/54102461/select-element-inside-dropdown-menu-issue

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!