【小程序入门】小程序页面跳转事件及无法跳转

上篇文章提到了怎么在页面中展现数据，以及全局变量的使用，查看https://blog.csdn.net/u014650759/article/details/91364148。这篇主要讲页面跳转。我们知道，一个页面的跳转，首先需要为组件绑定事件，以触发事件从而执行页面跳转代码。而事件又分为冒泡事件和非冒泡事件，以下为冒泡事件，其他组件事件无特殊申明都是非冒泡事件：

类型	触发事件
touchstart	手指触摸动作开始
touchmove	手指触摸后移动
touchcancel	手指触摸动作被打断，如来电提醒，弹窗
touchend	手指触摸动作结束
tap	手指触摸后马上离开
longtap	手指触摸后，超过350ms再离开

 

知道了事件后，我们还是以原来的官方案例来讲解，地址https://github.com/wechat-miniprogram/miniprogram-quickstart，页面中指定绑定事件：

对应js文件代码中也需要在page内申明对应的事件绑定函数，当然，我们无需更改原来的跳转log页代码，如下：

但是，当我们直接运行代码时，有可能会无法跳转，如果你是根据我前面的讲解文章设置了tabBar的话。所以这里有个知识点：如果跳转页面在tabBar中进行了申明的话，是不能通过wx.navigateTo()方法进行页面跳转的，因为它是首页中通过tabBar实现切换跳转的，会造成冲突。所以，去掉tabBar中关于跳转页面的申明即可。另外补充一点，如果要进行tabBar的切换怎么办？可以使用wx.switchTab()方法。

关于页面跳转的知识点，还有:页面跳转路由分三种，wx.navigateTo(OBJECT)：保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面。wx.redirectTo(OBJECT)：关闭当前页面，跳转到应用内的某个页面。wx.navigateBack()：关闭当前页面，回退前一页面。

如果需要在跳转中传递数据，则需将要传递的数据保存到url中，形如url跳转传递数据。修改代码如下

bindViewTap: function() {
  wx.navigateTo({
    url: "../logs/logs?id=1&title=标题abc"
  })
},

这里对应的logs页面，需在onLoad申明函数中指定options参数，并通过options参数使用的变量，来获取上个页面传递过来的参数：