跳转页面标识问题

问题:A页面点击按钮button,触发button事件进入B页面,并且在B页面打开一个b1弹窗;由别的路径或方法直接进入B页面,则不打开b1弹窗

目标示例图

解决方法一:query存字段(失败)

    失败原因:B页面中获取 this.$route.query.way的值一直为1,即使是通过标签切换,这并不符合设计

```

// A页面

createSecond(row) {

    this.$router.push({

         path: '/secondClassification',

         query: {

           // id: row.id,

           way: 1 // 标志(1):通知二级打开弹窗

         }

    })

}

```



解决方法二:query存字段(本地可以,但测试端失败,不知道为什么)

```

// A页面

createSecond(row) {

    this.$router.push({

         path: '/secondClassification',

         query: {

           // id: row.id,

           initialWay: {

             way: 1 // 标志(1):通知二级打开弹窗

           }

         }

    })

},

// B页面

 getInitialWay() {

      console.log('this.$route.query.initialWay', this.$route.query)

      if (this.$route.query.initialWay && this.$route.query.initialWay.way) {

          // 延迟一下再打开,防止出现闪屏的错觉

        setTimeout(() => {

          // services.get(`${this.url}/insertSecondLevelView`, { id: this.$route.query.id }).subscribe((res) => {

            // this.editForm = Object.assign({}, res.data)

            // console.log('res', res, this.dialogFormVisible)

            this.dialogFormVisible = true // 打开弹窗

          // })

        }, 200)

      }

}

```



解决方法三:利用路由钩子函数,可以获取到来源页面,根据来源页面决定是打开弹窗(失败)

    失败原因:单纯的由来源页面判断是不够的,从A页面直接切换到B页面,并不需要B页面打开弹窗,因此,需要增加一个判断是否触发了按钮button的字段,这又回到了query传值上。



解决方法四:利用sessionStorage(成功)

```

 // 存session

sessionStorage.setItem(key, value)

// 取session

const firstClassificationId = sessionStorage.getItem(key')

// 清除session:

sessionStorage.removeItem(key)

// 注:使用下面的clear会把所有session清除,不止是key

sessionStorage.clear(key)

```

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
禁止转载,如需转载请通过简信或评论联系作者。

推荐阅读更多精彩内容