el-select同时获取label、value

最新推荐文章于 2024-02-01 15:09:02 发布

毛三仙

最新推荐文章于 2024-02-01 15:09:02 发布

阅读量228

点赞数

分类专栏：后台管理系统文章标签： vue.js 前端 javascript Powered by 金山文档

本文链接：https://blog.csdn.net/m0_74149462/article/details/129179830

版权

后台管理系统专栏收录该内容

56 篇文章 2 订阅

订阅专栏

效果：

方法一

   <el-select v-model="formData.deptId"
                         @change="deptChange"
                         filterable placeholder="请选择归属部门">
                <el-option
                  v-for="(item,index) in deptList"
                  :key="index"
                  :label="item.deptName"
                  :value="item.deptId"
                />
              </el-select>

      deptChange(id) {
        let checkLabel = this.deptList.find(item => item.deptId === id).deptName
        this.formData.deptName = checkLabel
        console.log(this.$refs.deptListSelect)
      }

方法二

<el-select v-model="formData.deptId"
                         ref="deptListSelect"
                         filterable placeholder="请选择归属部门">
                <el-option
                  v-for="(item,index) in deptList"
                  :key="index"
                  :label="item.deptName"
                  :value="item.deptId"
                />
              </el-select>

console.log(this.$refs.deptListSelect.selected.label)
console.log(this.$refs.deptListSelect.selected.value)