使用element-ui中下拉框el-select时数据回显问题

以下代码 在el-form-item中使用下拉框 当编辑的时候 进行数据回显 weight为接口获取的当前行的weight数据

        <el-form-item
          label="权重值设置"
          prop="weight"
          :label-width="formLabelWidth"
        >
          <el-select v-model="ruleForm.weight" placeholder="请选择">
            <el-option
              v-for="item in options4"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>


methods:{
  handleCreate(row) {
         this.ruleForm.num = row.terminalId   //终端号
         this.ruleForm.weight =row.weight  //权重

}

问题 : 当编辑的时候 下拉框 回显的是 value的数据 而不是label的数据
原因 上面的 row.weight 是数值型数据 el-select 需要字符串
解决 : 使用 to.String()转换下再赋值 如下:

    handleCreate(row) {
         this.ruleForm.num = row.terminalId   //终端号
         this.ruleForm.weight =(row.weight).toString()  //权重
      } 

你可能感兴趣的:(elementui,下拉框,vue,javascript,vue.js,elementui)