异步更改为属性

时间:2017-09-26 20:06:23

标签: vue.js vuejs2

vuejs的新手。

我有一个带有以下脚本的vue(代码缩短):

export default {
  mixins: [asyncStatuses],
  props: {
    value: { type: Object }
  },
  data() {
    return {
      statuses: []
    };
  },
  computed: {
      hasStatuses() {
          return this.statuses && this.statuses.length > 0;
      }
  },
  beforeMount() {
    // This is an async call
    this.getStatuses().then((response) => {
      this.statuses = response.data.statuses;
    });
  }
};

在我的.vue文件中,我做了类似的事情:

<div v-if="hasStatuses">
    <div>Show a list of statuses</div>
</div>

问题是<div>永远不会出现。状态正确加载。我在computed.hasStatuses中放了一个调试器,但它从未运行过?

任何人都可以向我解释这种情况发生的原因和原因以及如何解决这个问题?

再次感谢!!

1 个答案:

答案 0 :(得分:2)

代码设置为self.statuses,但未定义self

self.statuses = response.data.statuses

只需使用this

this.statuses = response.data.statuses