共计 998 个字符，预计需要花费 3 分钟才能阅读完成。
明天遇到一个 bug~
场景形容：点击页面的批改按钮，获取以后内容的详情信息。而后这个谬误就进去了。Error in render: “TypeError: Cannot read property ‘content’ of undefined” 和 Cannot read property ‘content’ of undefined。
上代码：
`
<template>
<el-form :model="form"
v-if="Object.keys(form).length>0"
ref="form"
label-width="50px"
size="mini">
<!-- 内容 -->
<el-form-item label="题干"
class="form-item"
prop="quTitle.content">
<!-- 文字 -->
<el-input type="textarea"
v-model="form.quTitle.content"></el-input>
</el-form-item>
</el-form>
</template>
<script>
export default{data:()=>({
form:{
quTitle:{content:null}
},
}),
created(){
// 获取数据
this.getForm()
// 获取穿过来的值
this.form = this.params
},
props:{
// 穿过来的值
params:{
type:Object,
default:()=>{}
}
}
methods:{
// 获取数据
asynv getForm(){
// 拜访接口
this.form = await this.axios('门路')
}
}
}
</script>
`
思路：
1. 第一开始，自己认为是 content 没有获取到问题，后果，打印了多个 console, 也没找出个所以然来。- 放弃以后计划。2. 而后，自己认为是没有实时更新导致的问题，后果，$set() 写了，控制台仍旧在报错。3. 最初，我在 created 申明周期外面，打印了一个 form，发现并没有值。起因：
created 申明周期是曾经加载完了 data 和 el，而我申明的 form 为空的 object 且模板渲染了实现了，并没有找到 form 外面的内容，所以，报错了。解决办法：
我在渲染 form 的表单外面写了一个 v -if，如果没有数据，不让组件显示，so，谬误被完满解决了。最初，大家如果有更好的办法，欢送指出~
正文完
