为什么小程序的页面有二次跳转时会瞬间显示一下第一次的页面再跳转呢?

栏目:建站技术 2020-10-30

为什么小程序的页面有二次跳转时会瞬间显示一下第一次的页面再跳转呢?

navigateTo redirectTo switchTab tabBar

先来看示例代码并且在微信开发者工具上测试

下面看示例代码共有三个页面,分别是index productshow cart

index的js与wxml

Page({
    /*跳转到商品详情*/
    toProductshow: function (event) {
        //如果这里用navigateTo,跳转到详细页,然后详细页又跳转到购物车页面时,在跳转之前会瞬间显示一下首页,为什么会这样,看下面的说明
        wx.navigateTo({
            url: '../productshow/productshow?id=8'
        })
        //所以为了避免上面的问题,这里上面需要使用redirectTo
    }
})

<view bindtap="toProductshow">
点击进入详细页面
</view>

productshow的js与wxml

Page({
    /*跳转到购物车,注意跳转到tab栏目时需要使用switchTab*/
    toCart:function(){
        wx.switchTab({
            url: '/pages/cart/cart'
        });
    }
})

<view bindtap="toCart">点击进入购物车</view>

cart的js与wxml

Page({
})

<view>
这里就是购物车了
</view>


下面是app.json的代码

{
  "pages": [
    "pages/index/index",
    "pages/productshow/productshow",
    "pages/cart/cart"
  ],
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index",
        "iconPath": "imgs/toolbar/index.png",
        "selectedIconPath": "imgs/toolbar/index@selected.png",
        "text": "主页"
      },
      {
        "pagePath": "pages/cart/cart",
        "iconPath": "imgs/toolbar/cart.png",
        "selectedIconPath": "imgs/toolbar/cart@selected.png",
        "text": "购物车"
      }
    ]
  }
}

经过测试发现在index页面点击进入productshow页时,然后再从productshow点击进入cart页面时,会在进入cart页面前瞬间显示一下index页面的内容,然后再进入cart页面?那么为什么会这样?看了开发者文档发现wx.navigateTo的解释是保留当前页面,跳转到应用内的某个页面,所以原因就出现这里,因为navigateTo在跳转之前就保留了index页面,所以会瞬间显示一下index页面的内容,当然这里并不是我们想要的结果,所以只能通过redirectTo来跳转,下面是路由的几个api说明

1、wx.navigateTo
保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。
2、wx.redirectTo
关闭当前页面,跳转到应用内的某个页面。
3、wx.switchTab
跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面
4、wx.navigateBack
关闭当前页面,返回上一页面或多级页面。可通过 [getCurrentPages()] 获取当前的页面栈,决定需要返回几层。
5、wx.reLaunch
关闭所有页面,打开到应用内的某个页面。

相关阅读

中英文混和的字符串的ASCII与UNICODE编码与解码

2020-10-10172

//1:获取中英文混合字符的编码(ASCII码与UNICODE码)$str=&quot;官网制作:网巢网络&quot;;foreach(math($str)as$key=&gt;$value){if(preg_match(&#39;/^[x{4e00}-x{9fa5}]+$/u&#39;,$value)){//中文,注意中文这里暂时不转换,因为无法通过chr…

手机访问电脑网时自动跳转代码

2020-10-1049

4G降临,移动网站已经一发不可收拾,pc端和移动端官网并存。如何让别人访问你的pc端的官网直接跳转到移动端的网站呢?各位看官,小二上代码!来了!varurl=window.location.href;varurl_match=/vit=1$/i;if(!url.match(url_match)){if(navigator.userAgent.match(/(…

DOS命令批量获取文件夹内的名称及批量修改文件夹内名称

2020-10-10174

批量提取文件夹内文件名一:在文件夹内新建一个文本文件,名称随便起,这里为了演示,暂时起名叫!!!.TXT,放入下面的内容,!!!!!!.TXT这个是被生成的文件,用于存放文件夹内所有的文件名用的DIR*.*/B&gt;!!!!!!.TXT二:将!!!.TXT文件名的后缀改成.bat,然后双击运行,生成了!!!!!!.TXT文件三:打开!!!!!!.TXT文件…

在phpmyadmin中创建数据库时如何修改默认编码?

2020-10-1038

在phpmyadmin中创建数据时默认的编码是latin1_swedish_ci,但是我们在开发网站创建数据时却需要使用utf8_general_ci这个编码,那么如何修改这个latin1_swedish_ci默认的编码为utf8_general_ci呢?第一步:先在Xampp的控制面板开启MYSQL第二步:登陆phpmyadmin,如果是xampp,一般登…

如何将程序添加到右键菜单中?

2020-10-1033

方法一:在HKEY_CLASSES_ROOT*shell下面添加sublime_textCommand,修改Command项的默认值的数据数值为&quot;D:我的文档sublimetext3sublime_text.exe&quot;&quot;%1&quot;改了之后此方法你会发现不管选择什么类型的文件都会出现在右键菜单中方法二:修改HKEY_CLASS…

FTP上的文件不宜在线编辑

2022-04-4605

知道FTP软件使用的都知道,打开软件登录某一空间后,一边是本地的文件,另一边是服务器上的文件,而FTP软件就是连接本地与虚拟主机的桥梁,因为有了该软件,线上线下的上传下载就显得非常的简单。一般情况下,如果要对服务器上的文件进行修改,可以先将其下载到本地,再用dr将其打开进行编辑,待编辑到满意后,再上传上去,覆盖以前的文件,或是将以前的文件改个名字,直接上传上…