vue基于原生select标签实现动态多级联动选择

最新推荐文章于 2024-08-01 15:15:14 发布

置顶

Vincentzyc

最新推荐文章于 2024-08-01 15:15:14 发布

阅读量3.3w

点赞数 6

分类专栏： vue javascript 文章标签： vue 动态联动选择多级联动 select

本文链接：https://blog.csdn.net/zzzyyc/article/details/80402085

版权

本文讲的是vue基于原生select标签实现的动态多级联动选择

基于element-ui的Select选择器实现的请看我的另外一篇文章vue基于element-ui的Select选择器实现的动态多级联动下拉选择

本文demo地址：http://jsrun.net/yxXKp

代码如下：

Html

<div id="app">
  <select v-for="(arrItem,key) in selectList" v-model="selectArr[key]" @focus="position=key" @change="selected" :key="key" style="margin:10px;padding:10px">
    <option v-for="item in arrItem" :value="item.value" :key="item.value">{
  {item.label}}</option>
  </select>
  <p>选中项: {
  { selectArr }}</p>
</div>