我收到一个错误[Vue警告]:渲染错误:“ TypeError:无法读取未定义的属性'名称'”

时间:2018-09-18 06:46:03

标签: javascript vue.js vuejs2 axios vue-component

我正在使用vue,这是我的代码

一切正常,直到我提交表格。当我提交表单并尝试更新emailForm->选项卡-> zh->数据->名称时,我得到了一个错误。

<template>
    <el-form :model="emailForm.tabs" ref="emailForm" class="demo-emailForm" @submit="submitForm('emailForm')">
        <div v-for="(lan, key, index) in emailForm.tabs">
        <el-form-item :label="$t('Template Name')" >
            {{lan.data.name}}
       </el-form-item>
    <el-form>
<template>
<script>
        export default {
            data() {
                return {
                    emailForm: {
                        tabs: {
                            en: {
                                sortHeand: 'en',
                                title: 'English',
                                data: {
                                    name: "ad",
                                    subject: "asda",
                                    html_code: 'asdad',
                                    status: 0
                                }
                            }
                        }
                    }
                }
            },
            methods: {
                submitForm(formName) {
                    this.$refs[formName].validate(valid => {
                        if (valid) {
                            request({
                                url: this.getRoute(),
                                method: "post",
                                data: this[formName].tabs
                            })
                            .then(response => {
                                console.log(response)
                            })
                        }
                    });
                },
            }
        }
</script>

任何人都可以提出这个问题?

enter image description here

1 个答案:

答案 0 :(得分:2)

您正在尝试从变量/对象name中读取属性data,但是dataundefined,因此它无法从中读取属性name它。