uni-app学习记录03-路由跳转

Posted 2020-11-16 py-小白

<template>
    <view class="content">
        <!-- v-show是相对于display: none -->
        <view v-show="false"></view>
        <!-- v-if是删除这个元素 -->
        <view v-if="false"></view>
        <view>我是文本</view>
        <button type="primary" @click="toPath">跳转注册页面</button>
        <button type="primary" @click="toPath1">跳转未注册页面</button>
        <button type="primary" @click="toPath2">关闭当前页面再跳转</button>
        <button type="primary" @click="toPath3">可以返回几层页面 默认为一层</button>
    </view>
</template>

<script>
    import test from "../../components/test.vue"
    export default {
        data() {
            return {
                msg: "小白",
            }
        },
        methods: {
            toPath() {
                // 这个用于跳转到Tab注册过的页面
                uni.switchTab({
                    url: "../shezhi/shezhi"
                })
            },
            toPath1() {
                // 这个可以跳转到未在tab注册的页面，跳转是时注意这个会保留当前页面重新打开新的页面 一般用于要返回的页面
                uni.navigateTo({
                    // 在跳转的地址后面传参
                    url: "../one/one?name=huoyan"
                });
            },
            toPath2(){
                // 关闭当前页面之后再进行跳转
                uni.redirectTo({
                    url: "../one/one"
                })
            },
            toPath3(){
                // 返回上层页面 不填参数默认为1
                uni.navigateBack({
                    delta: 1
                });
            }
        },
    }
</script>