官方navigator组件文档 https://developers.weixin.qq.com/miniprogram/dev/component/navigator.html
在index.wxml文件中定义一个navigator
<navigator url="../list/list">访问list列表页</navigator>跳转的页面是…/list/list
list.wxml文件的内容
<view>这里是列表页,huangbaokang</view>编译测试,跳转默认是当前小程序跳转,跳转之后有一个回退的按钮。
如果open-type=“redirect”,在没有回退箭头。
增加点击时相关样式
index.wxml
<navigator url="../list/list" hover-class="buleTheme" >访问list列表页</navigator>index.wxss
.buleTheme{ color: blue;}跳转到新页面参数传递
<!--index.wxml--><navigator url="../list/list?author=huangbaokang" >访问list列表页</navigator><!--list.wxml--><view>这里是列表页,{{author}}</view><!--list.js-->/** * 生命周期函数--监听页面加载 */ onLoad: function (options) { this.setData({ author : options.author }) },如果open-type=“switchTab”,则url不支持queryString
<!--index.wxml--><navigator url="../list/list" open-type="switchTab" >马上去支付</navigator><!--list.wxml--><view>支付中心页面</view>app.json配置tabBar
"tabBar": { "list": [{ "pagePath": "pages/index/index", "text": "huangbaokang" }, { "pagePath": "pages/list/list", "text": "支付中心" } ] },
点击去支付,将跳转tabBar













