vue路由出口二次进入页面组件不执行created和mounted生命周期钩子

问题描述：参考网上所说，因为多个路由都渲染了同个组件，此时，不会销毁再创建组件而是会复用组件，页面不会刷新。
解决：
法一：实践成功
官方推荐的使用watch监听路由变化,组件中监听
注意：watch监听路由变化，我们的路由一定要有子路由，监听变化也紧局限在父子路由中，也就是我们这个路由一定要有子路由，在子路由跳转过程中会调用watch，能成功监听

watch: {
    $route(to) {
      if (to.path=='') {
        ...
      }
    }
},

法二：实践成功
使用标签包裹，在页面添加actived钩子函数，将要执行的代码放入actived中。每次重新进入组件都会执行actived钩子
index.js

 <keep-alive>
    <router-view/>
    </keep-alive>

页面组件中：

activated() {
    this.delCartsListSync([]);
    this.getCartList();
  },

法三：实践未成功
在 router-view上加上一个唯一的key，来保证路由切换时都会重新渲染触发钩子(这个方法我尝试了没成功，可能我未得精髓，但是网上都是这么说的，前两个种如果没成功可以试试这个)
index.js中

<router-view :key="key"></router-view>

computed: {
    key() {
        return this.$route.路由名!== undefined? this.$route.路由名+ +new Date(): this.$route + +new Date()
    }
}

法四：未实践，但觉思路可行
路由守卫–>路由独享守卫/路由组件守卫