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

您所在的位置:网站首页 小程序跳转失败 【小程序入门】小程序页面跳转事件及无法跳转

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

2024-01-18 13:22| 来源: 网络整理| 查看: 265

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



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3