标签：el 回显 value label 选中 change select

el-select 多选框使用 以及回显默认选中说明

<template>
  <el-select
    v-model="value"
    multiple
    filterable
    allow-create
    default-first-option
    placeholder="请选择文章标签">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
  </el-select>
</template>

<script>
  export default {
    data() {
      return {
        options: [{
          value: 'HTML',
          label: 'HTML'
        }, {
          value: 'CSS',
          label: 'CSS'
        }, {
          value: 'JavaScript',
          label: 'JavaScript'
        }],
        value: []
      }
    }
  }
</script>

根据官方的案例看出 value label 描述的值是一样的，想问为什么是一样的。有没有坑，这个按照官方的写法来实现就好
本文只讲一个事件

change	选中值发生变化时触发	目前的选中值
label ：是展示在输入框的值，
value：是@change 事件中选中的值 多选后是数组字符串形式
你的业务处理在change	事件中处理即可

el-select 多选回显怎么办？

按照官方文档的写法 
label ：是展示在输入框的值，
value：是@change 事件中选中的值 多选后是数组字符串形式
你只要把 value 的值跟 label 的值一样即可

 v-model="value" 这个value 就是展示的  你只要把回显是数组给到value 即可但是这个value一定是你数据中 value 的值  这样回显的数据才会默认选中
 v-model="value" 这个value 是自己定义的 你可以换做其他的命名也可以的 
 <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
 v-model="value"
 代码中的value  是一样的值 回显的数据才会默认选中

标签：el,回显,value,label,选中,change,select
来源： https://blog.csdn.net/weixin_50748620/article/details/122016391

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。