宝哥软件园

微信小程序按钮点击跳转页面详解

编辑:宝哥软件园 来源:互联网 时间:2021-08-24

在微信小程序中,按钮也是按钮/按钮标签,通过bindtap属性绑定点击事件:

然后在js中注册这个回调函数:

通过回调函数

wx . navigateto({ URL : '/pages/index/talkPage ',})跳转到talk page接口。

请注意,html接口应该在app.json中注册:

如果您没有注册,您将报告一个错误:导航到:失败网址' pages/index/talkpage '不在app.json中。

注册后编译,开发工具会自动为你创建相应的js和wxss文件,基本功能会在js中自动设置:

//pages/index/talk page . js page({/*** page的初始数据*/data: {},/* * *生命周期函数-监控页面加载*/onload:函数(选项){},/* * *生命周期函数-监控页面首次呈现*/onready:函数(){},/* * *生命周期函数-监控页面显示*/onshow3360函数(){},/* * *生命周期函数-监控页面隐藏*/on hiding 3360函数()。/* * *生命周期功能-监控页面卸载*/onunload3360function () {},/* * *页面相关事件处理功能-监控用户下拉动作*/onpulldown refresh 3360 function(){ },/* * *页面上拉底事件的处理功能*/onrechtoolm 3360 function(){ },/* * *用户点击右上角分享*/onsharepmessage 3360 function(){ })并填写,仍然很容易篡改。

2019年3月29日,我回复了余程的评论“怎么写两页对应两个按钮?”

同样的道理。

button BindTap=' GoToPage 1 '/;button BindTap=' GoToPage 2 '/;然后是js中的:

gotoPage 1: function(){ wx . navigatteto({ URL : '/pages/index/talk page 1 ',})} gotopage 2: function(){ wx . navigatteto({ URL : '/pages/index/talk page 2 ',})这是一个容易理解的写法,也可以绑定一个gotopage函数,跳转可以通过不同的参数来控制,大致是这样的:

按钮id=' 1 ' BindTap=' GoToPage '/;按钮id=' 2' bindtap=' gotopage'/js内部:

gotoPage:函数(事件){ const number=event . target . id;//1或2点击按钮1或按钮2后得到const URL='/pages/index/talk page '编号;//获取页面网址wx . navigatteto({ URL : URL,})}以上是边肖介绍的微信小程序按钮。点击跳转页面详细讲解整合,希望对大家有所帮助。如果你有任何问题,请给我留言,边肖会及时回复你。非常感谢您对我们网站的支持!

更多资讯
游戏推荐
更多+