vue.js - vue获取mongodb中的数据起初显示未定义，但还是可以渲染

问题描述

问 题

[Vue warn]: Error when evaluating expression "topic.meta.createAt != topic.meta.updateAt": TypeError: Cannot read property 'createAt' of undefined (found in component: <v-article>)

[Vue warn]: Error when evaluating expression "topic.meta.createAt": TypeError: Cannot read property 'createAt' of undefined (found in component: <v-article>)

这是报错信息，下面是我的代码部分。

    <h1>{{ topic.title }}</h1>
    <div class="info">
      <a v-for="tag in topic.tag" v-link="{name: 'tab', params: {tab: tag, page: 1}}" class="tag">
        {{ tag | convertTag}}
      </a>
      <a class="name"><strong>radical</strong></a>
      <span class="ask">{{ topic.meta.createAt | timeToNow }}&nbsp;发布</span>
      <span v-if="topic.meta.createAt != topic.meta.updateAt" class="update">{{ topic.meta.updateAt | timeToNow }}&nbsp;更新</span>
    </div>

这是 一个组件 topic是通过我的getters会获取到的，通过actions向mongodb请求数据，看上去一切都很正常。。。
convertTag和timeToNow都是我自己写的filter

解决方案

这样的你应该先判断存在topic.meta对象在去去它的属性，这样就不报错了,
报错的原因就是你没有获得meta数据的时候去获取它的属性

<h1>{{ topic.title }}</h1>
    <div class="info">
      <a v-for="tag in topic.tag" v-link="{name: 'tab', params: {tab: tag, page: 1}}" class="tag">
        {{ tag | convertTag}}
      </a>
      <a class="name"><strong>radical</strong></a>
      <span v-if="!!topic.meta" class="ask">{{ topic.meta.createAt | timeToNow }}&nbsp;发布</span>
      <span v-if="!!topic.meta && topic.meta.createAt != topic.meta.updateAt" class="update">{{ topic.meta.updateAt | timeToNow }}&nbsp;更新</span>
    </div>

这篇关于vue.js - vue获取mongodb中的数据起初显示未定义，但还是可以渲染的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！