报 [Vue warn]: vue Error in render : "TypeError : Cannot read property '$options' of undefind" 的错误

<el-select v-model="value" placeholder="请选择"><el-optionv-for="item in translation.options":key="item.value":label="item.label":value="item.value">&lt...

橙橙爱吃橙子。

4575人浏览 · 2019-09-23 11:21:48

橙橙爱吃橙子。 · 2019-09-23 11:21:48 发布

<el-select v-model="value" placeholder="请选择">
    <el-option
      v-for="item in translation.options"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
</el-select>

发现 translation 的值为 null，因此变量中没有 options 的属性值，遍历的生成的 item 也找不到该值，因此会报错，因此在使用该遍历的时候应该利用 v-if 先判断一下，如果不存在就不加载。如下加了 v-if="item" 判断的时候，报错就没有了。

<el-select v-model="value" placeholder="请选择">
    <el-option
      v-for="item in translation.options"
      v-if="item"
      :key="item.value"
      :label="item.label"
      :value="item.value">
    </el-option>
</el-select>

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^