vuejs挂载生命周期不触发

时间:2017-11-15 11:03:21

标签: vue.js vuejs2 vue-component

在我的App组件下面,mount()生命周期挂钩未被触发:

<template>
  <div>
    <div v-if='signedIn'>
        <router-view />
    </div>
  </div>
</template>

<script>
import Vue from 'vue'
import Oidc from 'oidc-client'

Vue.use(Oidc)

export default {
  data () {
    return {
      user: null,
      signedIn: false,
      mgr: new Oidc.UserManager({...settings...})
    }
  },
  methods: {
    signIn () {
    },
    signOut () {
    },
    getUser () {
    },
    mounted () {
      this.getUser()
    }
  }
}
</script>

我已经多次查看代码,不知道我缺少什么。 我在main.js文件中有这个:

new Vue({
  el: '#app',
  render: h => h(App),
  router
})

1 个答案:

答案 0 :(得分:17)

mounted区域内有method,这意味着这是一个&#39;功能&#39;调用已挂载(如getUser()),而不是在组件安装时自动调用的mounted

你应该改变它:

methods: {
    signIn () {
    },
    signOut () {
    },
    getUser () {
    }   
  },
mounted () {
      this.getUser()
}

然后它应该工作并由Vue自动调用作为正常的生命周期方法。

希望它有所帮助!