vue 跳转（跳转接收参数）问题总结

Posted 2023-02-22

参考技术A         使用说明： this.$router.push(  跳转地址 （可用name或path）: ' 跳转地址名称或地址'  , query （跳转后刷新不消失） :参数1:参数1   ，params （跳转后刷新消失） :参数1:参数1    )

      追加说明： 在本页面跳转，跳转后 可以后退 到之前的页面

        实例： this.$router.push(name:'home',query:id：‘123’)

  使用说明： this.$router.replace(  跳转地址 （可用name或path）:  ' 跳转地址名称或地址'  , query （跳转后刷新不消失） :参数1:参数1   ，params （跳转后刷新消失） :参数1:参数1   )

      追加说明： 在本页面跳转，跳转后 不可以后退 到之前的页面

        实例： this.$router.replace(name:'home',query:id：‘123’)

  使用说明： this.$router.resolve(  跳转地址 （可用name或path）:  ' 跳转地址名称或地址'  , query （跳转后刷新不消失） :参数1:参数1   ，params （跳转后刷新消失） :参数1:参数1   )    

   追加说明：跳转新页面

   实例（1）：const news =  this.$router.resolve(name:'home',query:id：‘123’)

             window.open(news.href,'_blank')

   实例（2）：news = this.$router.resolve(name:'home',query:id：‘123’)

             window.open(news ,'_blank')

      使用说明：接收到的  query是页面跳转时设置的  query：参数1:参数1 ；取参数 1   this.$route.query.参数1

                        接收到的  params 是页面跳转时设置的  params：参数1:参数1  

      实例: console.log(this.$route.query.id);

定义跳转方法，调用跳转时调用

     showForm(index)

                 // this.$router.replace(name: 'special_education', params: id: index)  //取代

                    this.$router.push(name:'special_education',query:indexs:index)  //追加

               // const news = this.$router.resolve(name:'special_education', query: indexs: index)

                // window.open(news.href,'_blank')  //新开页面

     

定义接收方法，接收时调用

getParams()

  // 取到路由带过来的参数

  this.mallCode =this.$route.query.indexs;

console.log(this.$route.query.indexs);

// 将数据放在当前组件的数据内

//this.mallInfo.searchMap.mallCode = routerParams;

//this.keyupMallName()