element-ui中的select下拉列表 设置默认值

element-ui中的select下拉列表如何设置默认值？

在element-ui的运用中，涉及到了select下拉列表。项目中需要将select的默认值给展示出来

那如何修改呢？

上element-ui中的代码片段

<template>  <el-select v-model="value" 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: '选项1',          label: '黄金糕'        }, {          value: '选项2',          label: '双皮奶'        }, {          value: '选项3',          label: '蚵仔煎'        }, {          value: '选项4',          label: '龙须面'        }, {          value: '选项5',          label: '北京烤鸭'        }],        value: ''      }    }  }</script>

修改如下

<template>  <el-select v-model="value" 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: '0',          label: '全部'        }, {          value: '1',          label: '待收款'        }, {          value: '2',          label: '已收款'        }, {          value: '3',          label: '已发货'        },        value: '全部'      }    }  }</script>

接下来。我们在点击查询的方法里打印一下value的值

onSearch () {    // console.log('value是' + this.value)    if (this.value === '全部') {      this.value = '0'    }}

这样就保证了this.value打印出来的为0,1,2,3。拿到这些值后，就可以传给后端，请求数据了！