【UI】elementui select点击获取label 和 value

简介: 【UI】elementui select点击获取label 和 value
<template>
  <el-select v-model="value" placeholder="请选择" @change="selectChange">
    <el-option
      v-for="item in options"
      :key="item.value"
      :label="item.label"
      :value="{ value: item.value, label: item.label}">
    </el-option>
  </el-select>
</template>
<script>
  export default {
    data() {
      return {
       options: [{
            value: '选项1',
            label: '黄金糕'
          }, {
            value: '选项2',
            label: '双皮奶'
          }, {
            value: '选项3',
            label: '蚵仔煎'
          }, {
            value: '选项4',
            label: '龙须面'
          }, {
            value: '选项5',
            label: '北京烤鸭'
          }],
          value: ''
      }
    },
    methods: {
      // 点击事件
      selectChange(val){
    console.log('select点击了',val)
      }
    }
  }
</script>

和原来select不同的地方

1.增加change事件selectChange

2.原来的:value="item.value"改为:value="{ value: item.value, label: item.label}"

注意:下拉框change事件selectChange不要加()

目录
相关文章
|
5月前
|
JavaScript 索引
Vue开发中Element UI/Plus使用指南:常见问题(如Missing required prop: “value“)及中文全局组件配置解决方案
Vue开发中Element UI/Plus使用指南:常见问题(如Missing required prop: “value“)及中文全局组件配置解决方案
365 0
|
7月前
|
图形学
小功能⭐️Unity获取点击到的UI
小功能⭐️Unity获取点击到的UI
|
8月前
【UI】elementui el-pagination分页位置靠右
【UI】elementui el-pagination分页位置靠右
321 0
|
8月前
|
前端开发
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
【UI】 elementui的dialog弹窗打开时CSS的BUG | 滚动条消失bug
275 0
|
8月前
|
JavaScript
【UI】 elementUI的select-tree组合下拉框,选择后下拉框不收起
【UI】 elementUI的select-tree组合下拉框,选择后下拉框不收起
393 1
|
8月前
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
903 3
|
10月前
【UI】 elementui card 禁用效果
【UI】 elementui card 禁用效果
122 0
|
10月前
【UI】 element -ui select下拉框label显示多个值
【UI】 element -ui select下拉框label显示多个值
268 1
|
10月前
【UI】 elementui input输入框自动获取失去焦点
【UI】 elementui input输入框自动获取失去焦点
584 1
|
10月前
【UI】 vue2 修改elementui 表格table 为空时暂无数据样式
【UI】 vue2 修改elementui 表格table 为空时暂无数据样式
487 1

热门文章

最新文章