{ "pages": [ "pages/index/index", "pages/logs/logs" ], "window": { "navigationBarBackgroundColor": "#bfa", "navigationBarTextStyle": "black", "navigationBarTitleText": "好消息" } }
目录结构变为:
官网位置:API ---> 路由--->有很多可以用的调转的方法 wx.navigateTo // 保留当前页,即跳转之后上面出现的是箭头可以返回上一页 补充: 在小程序里没有window 而是wx,在跳转的路由内的回调(success, fail, complete)和 Vue里的promise(then, catch , finally) 下面这两种用法和 navigateTo 一样,但是都会出现小房子样式的图标用来返回的首页; wx.redirectTo // 关闭当前页 wx.reLaunch // 关闭所有页 代码实现: index.wxml中的代码:<view class="indexContainer"> <image class="avatarUrl" src="/static/images/nvsheng.jpg"></image> <text class="userName">G『 s 』</text> <!-- 测试事件绑定 --> <!-- <view class="goStudy" catchtap="handleParent"> <text catchtap="handleChild">{{message}}</text> </view> --> <view class="goStudy" bindtap="toLogs"> <text>{{message}}</text> </view> </view>
在index.js中的代码:
// 跳转到日志logs页面的方法 toLogs() { wx.navigateTo({ url: '/pages/logs/logs', }) // wx.redirectTo({ // url: '/pages/logs/logs', // }) // wx.reLaunch({ // url: '/pages/logs/logs', // }) },为了使日志页头部显示日志信息而不是首页信息,所以需要增加日志的局部配置,局部配置高于全局配置; 所以在log.json文件中的代码:
{ "usingComponents": {}, "navigationBarTitleText": "日志" }