组件式 navigator:
<!--
声明式导航 navigator 组件
切换tab页面 设置 open-type="switchTab"
跳转路由 入栈 不设置 open-type
url 为 app.json 内的页面路由,并且以 / 开头
-->
<navigator class="nav-style" open-type="switchTab" url="/pages/index/index">TabSwitchToIndex</navigator>
编程式跳转
切换Tab页面
// 绑定事件 wx.switchTab
tabChange() {
wx.switchTab({
url: '/pages/index/index',
})
}
跳转路由,压栈
// 绑定事件
todetal(event) {
// 支持类似 swift 中的元组,但是是 {} 大括号声明
const { lhindex,lhtitle } = event.target.dataset
console.log(lhindex + lhtitle)
wx.navigateTo({
// 不携带参数的跳转,可以用单引号 ',携带参数的跳转,需要用反单引号 `
url: `/pages/detail/detail?title=${lhtitle}`,
})
}
// 入参 data-自定义字段(不支持驼峰命名,即便使用驼峰命名,接收参数时,key自动转换成全小写)
<button bind:tap="todetal" data-lhindex="{{index}}" data-lhtitle="{{item.title}}">clickToDetal</button>
// 出参 页面生命周期函数中的固定参数
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
const title = options.title
console.log(options)
this.setData({
title: title
})
}
对比输入框的入参、出参
<input class="productM" type="num" bindinput="InputEvent" value="{{product.num}}"/>
InputEvent(event){event.detail.value}