微信小程序如何进行页面切换呢?
一,使用声明式导航
1.对于tabbar页面的跳转(若不明白tabbar可自行百度)
使用switchTab进行跳转
在wxml中输入
<navigator url="/pages/message/message" open-type="switchTab">非tabbar页面的跳转</navigator>
其中/pages/message/message是跳转的地址,跳转方式是switchTab
2.对于非tabbar页面的跳转
使用navigator进行跳转
在wxml中输入
<navigator url="/pages/info/info" open-type="navigate">tabbar页面的跳转</navigator>
其中/pages/info/info是跳转的地址,跳转方式是navigate
3.返回到上一个页面
在一个页面的wxml中输入
<navigator open-type="navigateBack" delta="1">返回上一个页面</navigator>
注意:要想返回到之前页面,open-type的类型必须是:navigateBack
而delta后的数字表示的是要返回的层数
二,使用编程式导航
1.在wxml中添加一个button组件(即按钮)
<button bindtap="tiaozhuan" >tiaozhuan2 </button> //这是使用bindtap进行触摸,就是你点击这个按钮便会执行操作“tiaozhuan”
2.在js文件中添加名字为“tiaozuan”的函数,其中函数中使用wx.navigateTo指令
tiaozhuan() {
wx.navigateTo({
url: '/pages/lunbotu/lunbotu' //url后面是跳转地址(备注不要复制进去)
})
}
正如上面使用声明式导航说的,跳转到非tabbar页面的时候用navigateTo,而跳转到tabbar页面的时候用switchTab,这里便不做赘述,懂得都懂。(若不明白tabbar可自行百度)
最后就是“后退”环节了
1.在wxml中添加一个button组件(即按钮)
<button bindtap="goback">后退</button>
2.接着在js文件中定义“goback”函数
goback() {
wx.navigateBack({
delta:1 //这里的delta表示后退的页面数量,如果只退一个的话可以不写delta
})
}文章来源:https://www.toymoban.com/news/detail-607380.html
以上是我对微信小程序的学习,若各位有发现问题,请多多指教!阿里嘎多!文章来源地址https://www.toymoban.com/news/detail-607380.html
到了这里,关于微信小程序跳转页面的不同方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!