1. 程式人生 > >vue router 跳轉到新的視窗方法

vue router 跳轉到新的視窗方法

在CreateSendView2.vue 元件中的方法定義點選事件,vue router 跳轉新的視窗通過採用如下的方法可以實現傳遞引數跳轉相應的頁面
goEditor: function (index,channel) {
//跨域的方法傳遞引數(參見
let routeData = this.$router.resolve({path: '/createImageText2', query: {ID: index,channel:channel}});
window.open(routeData.href, '_blank');
注:1、let routeData = this.$router.resolve({path:`/createImageText2/${ID,channel}`)這樣傳遞不了引數需要使用上面的方法
2、_blank是表示開一個新視窗

在PreviewImageText.vue元件頁面中通過created()生命函式接收CreateSendView2.vue元件傳遞地引數id,channel,在該元件中data中定義變數來接收
created(){
this.preImgMsgDTO.channel=this.$route.query.channel
this.preImgMsgDTO.id=this.$route.query.ID

}

query,和params的區別

1、用法

   A、query要用path來引入,接收引數都是this.$route.query.name。

B、params要用name來引入,接收引數都是this.$route.params.name。

2、效果

A、query類似於ajax中get傳參,即在瀏覽器位址列中顯示引數。

B、params則類似於post,即在瀏覽器位址列中不顯示引數。

3、個人建議

在路由傳參上建議使用params,以隱藏引數,做好安全保密。