Vue/Nuxt - 渲染整个视图后运行代码？答案

【问题标题】：Vue/ Nuxt - run code after the entire view has been rendered?Vue/Nuxt - 渲染整个视图后运行代码？
【发布时间】：2018-03-05 05:46:51
【问题描述】：

我想在渲染整个视图之后创建一些函数/mounted:

export default {
  mounted: function () {
    this.example = function() {
      return 'example'
    },
    function() {
      console.log('mounted') // does not work
    }
  },
  created () {
    console.log(this.example()) // error
  },
  methods: {
    submitMessage() {
      console.log(this.example()) // example
    }
  }
}

为什么我在created() 收到以下错误？

TypeError: this.example is not a function
    at VueComponent.created (index.vue:119)
    at callHook (vue.runtime.esm.js:2661)
    at VueComponent.Vue._init (vue.runtime.esm.js:4222)
    at VueComponent (vue.runtime.esm.js:4392)
    at createComponentInstanceForVnode (vue.runtime.esm.js:3674)
    at init (vue.runtime.esm.js:3491)
    at createComponent (vue.runtime.esm.js:5143)
    at createElm (vue.runtime.esm.js:5086)
    at VueComponent.patch [as __patch__] (vue.runtime.esm.js:5602)
    at VueComponent.Vue._update (vue.runtime.esm.js:2420)

有什么想法吗？

【问题讨论】：

Vue.set 怎么样？ vuejs.org/v2/api/#Vue-set
@RichardMatsen 有什么好的例子我可以如何使用set？
实际上，我认为@asemahle 已经做到了——钩子的顺序是创建然后挂载的，所以在创建的钩子中添加你的函数（并在挂载中测试它们）。

标签： vue.js vuejs2 nuxt.js

【解决方案1】：

created 钩子在mounted 钩子之前称为。当created()函数运行时，this.example还没有被声明。

您可以在声明后调用this.created()。

请参阅lifecycle diagram。

【讨论】：