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

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

浏览量:1556 时间: 来源:习明然

上篇文章提到了怎么在页面中展现数据,以及全局变量的使用,查看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参数使用的变量,来获取上个页面传递过来的参数:

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎