在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,以隱藏參數,做好安全保密。
