微信小程序页面跳转(三种方法)

方法1 对标签绑定点击事件

<view bindtap="clickMe" data-nid="123" data-name="SD" >点我跳转</view>

Page({
...
/**
* 点击绑定的事件
*/
clickMe:function(e){
var nid = e.currentTarget.dataset.nid;
console.log(nid);
}
})

方法2 页面跳转

这里是指函数接收一个字典，其中 url 对应的值是一个 String 就是我们要跳转的页面地址。

wx.navigateTo({
url: '/pages/redirect/redirect?id='+nid
})

同时在对应页面也需要编写相应的 js 方法接受参数。也就是监听页面加载的生命周期函数 -- onload: function (options)，页面跳转过来之后自动执行该方法。参数 options 就是我们传递的参数

redirect.js

Page({
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
console.log(options);
}
})

注意此种页面跳转只能跳转到非tabbar的页面噢

方法3 通过标签跳转

这种方式有点类似于 html 中的 a 标签

<navigator url="/pages/redirect/redirect?id=666">跳转到新页面</navigator>

以上就是目前学习做微信小程序中页面的跳转的知识点啦，欢迎大佬们做出指正!!!

文章来源地址https://uudwc.com/A/MpRGw