javascript - 重定向同一组件时不会调用 Vuejs 钩子(Hook)

Question

我必须在 Vuejs 项目中进行分页。两者处于同一水平并具有共同的组成部分。当我从 post/new 重定向到 post/edit/:id beforeMount 方法不会被调用。

redirect() {
    this.$router.push({path: `home/post/edit/${this.post.id}`})
  },

路线:

 {
      path: 'home',
      name: 'home',
      component: {
        render(c) {
          return c('router-view')
        }
      },
      children: [  
        {
          path: 'post/new',
          component: PostForm,
          name: 'Create',
          props: {readOnly: false}
        },
        {
          path: 'post/edit/:id',
          component: PostForm,
          name: 'Edit',
          props: {readOnly: false}
        },

      ]
    },

Answer 1

由于性能原因，PostForm 的实例被重用。这就是为什么 beforeMount 只被调用一次。

您应该将代码移至:

beforeRouteUpdate (to, from, next) {
    // the code you currently have in beforeMount
}

参见https://router.vuejs.org/guide/essentials/dynamic-matching.html#reacting-to-params-changes正如 Jbluehdorn 所建议的。