日常开发记录- ElementUI select选择器编辑时反显的是 value 值，而没有显示出对应的 lable 值...

原因可能是因为，后台返回的 value 字符串类型，但是前端自己写的下拉选择 option 对应的 value 是整数类型，就会导致对应不起来，渲染不出效果。

<template>

  <el-select v-model="value" placeholder="请选择">

    <el-option

      v-for="item in cities"

      :key="item.value"

      :label="item.label"

      :value="item.value">

      <span style="float: left">{{ item.label }}</span>

      <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>

    </el-option>

  </el-select>

</template>

<script>

export default {

  data () {

    return {

      cities: [{

        value: '0',

        label: '关'

      }, {

        value: '1',

        label: '开'

      }],

      // 这里注意 value是字符串类型不是整数类型 value: 1不对

      value: '1'

    }

  }

}

</script>

错误效果展示：

正确效果展示：