javascript - Bagaimana untuk mendapatkan nilai label komponen pilih dalam elemen-ui?
曾经蜡笔没有小新
曾经蜡笔没有小新 2017-06-12 09:29:43
0
3
1960
. yang merupakan nilai yang diberikan dalam atribut label). ) nilai ini, saya tidak mahu mendapatkan nilai yang dicetak di bawah, bagaimana untuk menyelesaikannya, saya jengkel dengan masalah ini.

曾经蜡笔没有小新
曾经蜡笔没有小新

membalas semua(3)
阿神

Pilihan anda dipaparkan secara kitaran dalam bentuk objek tatasusunan (tidak berulang). Jadi ia boleh diperolehi dengan hanya mengendalikan borang data,
add@change="changeValue"

Gunakan kaedah mencari Array untuk mencari objek dalam tatasusunan menggunakan sifat objek

changeValue(value) {
    console.log(value);
      let obj = {};
      obj = this.options.find((item)=>{
          return item.value === value;
      });
      console.log(obj.label);
}
具体demo如下:
// html
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@1.3.5/lib/index.js"></script>
<p id="app">
<template>
  <el-select v-model="value" placeholder="请选择" @change="changeValue">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
    </el-option>
  </el-select>
</template>
</p>
// js
var Main = {
    data() {
      return {
        options: [{
          value: '选项1',
          label: '黄金糕'
        }, {
          value: '选项2',
          label: '双皮奶'
        }, {
          value: '选项3',
          label: '蚵仔煎'
        }, {
          value: '选项4',
          label: '龙须面'
        }, {
          value: '选项5',
          label: '北京烤鸭'
        }],
        value: ''
      }
    }
  }
var Ctor = Vue.extend(Main)
new Ctor({
    methods:{
          changeValue(value) {
            console.log(value);
          let obj = {};
          obj = this.options.find((item)=>{
              return item.value === value;
          });
          console.log(obj.label);
        }
  }
}).$mount('#app')
@import url("//unpkg.com/element-ui@1.3.5/lib/theme-default/index.css");

Anda boleh menyalinnya ke alamat ini dan menjalankannya

曾经蜡笔没有小新

label(ref="xxx" data="56")

this.$refs.xxx.getAttribute('data')

typecho

Boleh cuba terbalikkan label dan nilai, terima kasih~

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan