一些废话

假期时候要做一个数据库课设,开发过程中在vue+elementui的一些组件使用遇到了好多问题,该问题只是其中之一,令我十分苦恼,现将问题上传博客,后续还会继续更新我遇到的一些问题

原因

后端传来的数据类型int,而el-option绑定列表value值为‘  ‘字符串

代码:

修改前:

stateList: [
        {
          value: '1',
          name: '运行中'
        },
        {
          value: '2',
          name: '已停运'
        }
      ],
<el-form-item label="状态" prop="state">
        <el-select v-model="form.state" placeholder="请选择">
          <el-option
              v-for="item in stateList"
              :key="item.value"
              :label="item.name"
              :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>

后端传回form中的state为int类型转化为Number,与value=’1’不符,导致el-select显示值不回显。

修改后:

stateList: [
        {
          value: 1,
          name: '运行中'
        },
        {
          value: 2,
          name: '已停运'
        }
      ],
<el-form-item label="状态" prop="state">
        <el-select v-model="form.state" placeholder="请选择">
          <el-option
              v-for="item in stateList"
              :key="item.value"
              :label="item.name"
              :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>

 效果

修改前:

修改后:

总结

 看了好几个博客,和我的问题正好相反,他们要将后端传值转化为String类型,但仍然对我有很大帮助,以下是链接

 el-select ——el-option中 value、 label的显示问题_el-option回显示其它值_).(的博客-CSDN博客

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注