zoukankan      html  css  js  c++  java
  • 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)
    },
  • 相关阅读:
    微信小程序入门
    rem js相关
    移动端rem.js使用方法
    手机访问PC网站自动跳转到手机版
    当 return 遇到 try
    Ubuntu apt 使用代理
    shell 十进制数字转十六进制字符串并将结果保存到变量
    (二)一起学 Java Collections Framework 源码之 AbstractCollection
    (一)一起学 Java Collections Framework 源码之 概述
    解决 meld 出现 locale.setlocale(locale.LC_ALL,'') 失败的问题
  • 原文地址:https://www.cnblogs.com/ddqyc/p/13617248.html
Copyright © 2011-2022 走看看