天天看點

vue之 從一個頁面跳轉到另一個頁面并攜帶參數

參考連結

https://www.jb51.net/article/167464.htm
           

方法

b 頁面

a标簽中添加跳轉函數

<a class="orderBtn1 sIRicon2" href="javascript:void(0);" target="_blank" rel="external nofollow"  rel="external nofollow" @click="toMallInfo('M000989')"><i class="sIRicon"></i>商場</a>

	
toMallInfo: function(mallCode){
	  this.$router.push({
		   path: '/propertyInfo/mall/mallList', 
		   // name: 'mallList',
		   query: {
		    	mallCode: 'M000989'
		   }
	  })
 },
           

将跳轉的url添加到 $router中。

path 中的url 最前面加 / 代表是根目錄下,不加則是子路由

通過path + query 的組合傳遞參數
           

a 頁面

跳轉頁面接收參數

created(){
   this.getParams()
},
methods :{
	getParams(){
   
	    const routerParams = this.$route.query.mallCode;   // 取到路由帶過來的參數
	   
	    this.mallInfo.searchMap.mallCode = routerParams;   // 将資料放在目前元件的資料内
	    this.keyupMallName();
    }
 },
watch: {
   '$route': 'getParams'
 }
           
vue