关于vue.js:vue-多个路由使用同一个组件页面

在我的项目中， 会有多个路由共用一个页面组件， 比方新增&编辑页面， 根本一样，只是数据结构不同而已， 这时新建路由和编辑路由，就能够应用同一个页面组件

但，存在一个问题，就是切换路由时， 路由变动了， 不会从新触发页面组件的钩子函数（只在第一次加载时调钩子函数）。这个问题是页面钩子生命周期相干， 为了解决能从新获取数据，从新加载页面。

总结了以下解决方案

办法一： 给router-view 里增加 key 惟一管制

//在父组件加载路由的中央，减少key<router-view :key="$route.fullPath"></router-view>

办法二： 通过监听 $route 路由的办法

//在共用的页面组件中减少路由监听事件 watch:{      '$route': function(to, from){        if(to==="/create"){          // 解决该路由下的数据        }        else if(to==="/update"){          // 解决该路由下的数据        }      },    },

办法三： 通过减少一个两头页面 empty.vue 解决跳转

methods: {    init(){            // update 和create 路由都指向同一个组件      let id = this.$route.query.id       if(id){        //编辑        this.$router.replace({path:"/update", query:{id, id}})      }      else{        //新增        this.$router.replace({path:"/create"})      }         },}