vue watch监听执行2次

最新推荐文章于 2024-03-13 18:03:24 发布

zongfunday

最新推荐文章于 2024-03-13 18:03:24 发布

阅读量9.9k

点赞数 1

CC 4.0 BY-SA版权

文章标签： vue.js 前端

本文链接：https://blog.youkuaiyun.com/u014788505/article/details/122045662

本文介绍Vue中使用Router的watch监听特性时遇到的问题及解决办法。通过引入锁的概念来避免watch监听新旧数据改变时执行两次的问题，提供了一个具体的实现示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原理：watch监听 原理是监听模式 下的新旧数据改变 他是2个条件语句 所以会执行2次

解决方案：使用锁的概念

data() {
        return {
            isGetRoute:false
        }
    },
  watch: {
      $route(route) {
          if (this.isGetRoute) {
            this.isGetRoute = !this.isGetRoute
            console.log(this.isGetRoute,'this.isGetRoute')
            store.commit('permission/getCurrentPagePermission', route.path)
            console.log(store.state.permission.currentPagePermission,'当前路由下的权限')   
          }
}