Vue Cannot read property 'xxx' o

2020-05-26  本文已影响0人  泪滴在琴上

问题场景
使用{{}}文本插值方式,通过.级联显示内容。如下代码,foo通过后端接口返回。
后端内容返回之前,控制台会Cannot read property ‘xxx’ of undefined的错误。

<div>
  <h1>{{ foo.title }}</h1>
  <p>{{ foo.description }}</p>
</div>

解决方案

<div>
  <h1 v-if="foo.title">{{ foo.title }}</h1>
  <p v-if="foo.description">{{ foo.description }}</p>
</div>

或者

<div>
  <template v-if="foo">
    <h1>{{ foo.title }}</h1>
    <p>{{ foo.description }}</p>
  </template>
</div>

或者

new Vue({
  foo: {
    title: '',
    description : ''
  },
  created(){
    // 调用后端接口
  }
})

————————————————
版权声明:本文为CSDN博主「jiangshanwe」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/jiangshanwe/java/article/details/86499898

上一篇 下一篇

猜你喜欢

热点阅读