uniapp 頁面跳轉

跳轉到tabbar頁面  注意  跳轉到tabbar頁面及open-type="switchTab"不可以帶參數

<navigator url="../index/index" open-type="switchTab">跳轉到首頁</navigator>
 <navigator :url="'/pages/index/index?id='+num" open-type="switchTab">跳轉到首頁</navigator>  報錯

 

跳轉頁面帶參數寫法   num為變量

<navigator :url="'/pages/detail/detail?id='+num" >跳轉到詳情頁</navigator>

<navigator :url="'/pages/detail/detail?id='+num+'&myname='+'hedan'" >跳轉到詳情頁</navigator>

data() {
return {
   type:"D",
    num:32
}
},

跳轉事件 字符串連接   es6絕對路徑   es6相對路徑  三種寫法

<button type="default" @click="goDetail">事件跳轉</button>

           // goDetail(){
            //     uni.navigateTo({
            //         url:"/pages/detail/detail?munber="+this.num
            //     })
            // }
            goDetail(){
                uni.navigateTo({
                    // url:`/pages/detail/detail?myNum=${this.num}&id=12`
                    url:`../detail/detail?myNum1=${this.num}&id=12`
                })
            },

跳轉到tabbar頁面帶參數方式兩種

一、關閉應用所有頁   跳到指定頁面

<button type="default" @click="relaunch">跳轉到tabbar頁面吊帶參數</button>

            relaunch(){
                uni.reLaunch({
                    url:`../index/index?indexNum1=${this.num}&id=12`
                })
            },

index.vue頁面

   onLoad(e) {
       console.log("index onload")
       console.log('load',e)
    },

 

 

二、全局變量傳值  

<button type="default" @click="goIndex">跳轉到tabbar頁面</button>

    goIndex(){
         //給全局變量賦值
         getApp().globalData.text = 'testChange';
         uni.switchTab({
                url:"/pages/index/index"
         })
    }

 

在app.vue中定義全局變量

 

 

onShow(e){
            console.log("index onshow")
            //獲取全局變量的值
            console.log(getApp().globalData.text)
},