微信小程序实现界面之间的跳转

说到微信小程序之间的跳转主要归为三类:

1,跳转到指定页面,保存当前页面wx.navigateTo

2,跳转到指定页面,关闭当前页面 wx.redirectTo

3,返回之前页面,跳转之前的页面wx.navigateBack

接下来我主要通过实例来解析这三种方式如何跳转

首先是wx.navigateTo

我以上一节为例进行拓展:编写我的第一个微信小程序https://blog.csdn.net/wyf2017/article/details/82957739

先展示下效果图

可以看出我们使用wx.navigateTo实现页面跳转，当点击开启小程序跳转到第二个界面的时候我们可以看到最顶上有一个返回上一级的箭头，对于我们启动进入小程序是不能返回到上一级的，这种场景适合于有多个子目录的，那么如何解决这个问题呢，且听我慢慢讲解。

使用wx.redirectTo

这种方式是跳转到另外一个界面关闭当前界面，请先看效果图

当我们点击开启小程序我们可以跳转到第二个界面，重点是最顶上是没有返回箭头的，这正是我们想要的结果。

最后就是我们使用wx.navigateBack这个方法的时候，因为他的作用是跳转到之前的页面所以我们点击开启小程序是无法跳转到第二个界面，目前刚学主要还是用的是前面2中方法。

说了这么到底这么实现页面之间的跳转呢？

其实只要在我们创建的每一个界面的.js里面添加这段代码即可

Page({
  OnTap:function(){
    wx.redirectTo({
      url: "../posts/post"
    })
  }
})

url: "../posts/post"这里使用的是相对路径，然后后面posts是指你的目录，post是指你要跳转的下一个页面post.wxml文件

比如我这里点击的是开启小程序实现的页面跳转需要在哪里添加如下代码

添加这段代码就可以触发事件。

好了微信小程序实现页面之间的跳转就介绍到此，顺便不补充一句微信小程序在页面实现跳转最多跳转5级

ps:想要学习微信小程序的小伙伴请关注我的公众号我会不定期给大家提供学习资源。

点下这个链接就可以https://blog.csdn.net/wyf2017/article/details/96638855