element ui下拉框如何实现默认选择?

Question

为什么我这样写没反应呢
<span class="spec">运营商级别</span> <el-select v-model="selected1" placeholder="">

  <el-option
  v-for="item in options1"
  :label="item.label"
  :value="item.value">
</el-option>

</el-select>

export default{

 data(){
   return{
   selected:'',
   options1:[{
       value: '选项1',
      label: '省级运营商'
    }, {
      value: '选项2',
      label: '市级运营商'
    }, {
      value: '选项3',
      label: '县级运营商'
    }]
   }
 },
 computed:{
  selected:function(){
   return this.$store.state.level
  }
 }

}

Answer 1

1. 在data对象中，声明 selected1

2. 直接赋值：

   比如，想默认显示第2项：
   this.selected1 = this.options[1].label;

Answer 2

因为你这样写不对, 你那个 v-model="selected1", 这个 selected1 在 data 里根本没有呀...

应该这样...

<div id="app">
<template>
  <el-select v-model="value4" clearable placeholder="请选择">
    <el-option v-for="item in options" :label="item.label" :value="item.value">
    </el-option>
  </el-select>
</template>
</div>

var Main = {
    data() {
      return {
        options: [{
          value: '选项1',
          label: '黄金糕'
        }, {
          value: '选项2',
          label: '双皮奶'
        }, {
          value: '选项3',
          label: '蚵仔煎'
        }, {
          value: '选项4',
          label: '龙须面'
        }, {
          value: '选项5',
          label: '北京烤鸭'
        }],
        value4: '选项2'
      }
    }
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

注意 v-model="value4" 这里的 value4 要和 options 里的 value 保持一致...

Answer 3

答案是要写在data里面不能写在computed里面 selected8:this.$store.state.runner.region,

     options8: [{
      value: '选项1',
      label: '黄金糕'
    }, {
      value: '选项2',
      label: '双皮奶'
    }, {
      value: '选项3',
      label: '蚵仔煎'
    }, {
      value: '选项4',
      label: '龙须面'
    }, {
      value: '选项5',
      label: '北京烤鸭'
    }],