原创声明:本文为作者原创,未经允许不得转载,经授权转载需注明作者和出处
通过这个动态图你应该发现问题了,当点击测试进入电影界面时,title先显示了WeChat然后显示的电影,这个体验肯定是难以接受的,原因是电影界面的title是在js文件中page的生命周期方法中设置的。
Page({
data: {},
onLoad: function (options) {
// 页面初始化 options为页面跳转所带来的参数
},
onReady: function () {
// 页面渲染完成
wx.setNavigationBarTitle({
title: '电影'
})
},
onShow: function () {
// 页面显示
},
onHide: function () {
// 页面隐藏
},
onUnload: function () {
// 页面关闭
}
})
通过注释你应该明白了,设置标题写在了onReady方法中,也就是页面已经渲染完成了,在onReady之前显示的title就是json文件(覆盖关系,如果在子页面json文件设置title会覆盖app.json全局设置)中的title。可能你会说将wx.setNavigationBarTitle写在onLoad函数中,不过如果这样设置是不对的,因为onLoad执行过后才渲染页面,在渲染页面时title会从json文件中读取,导致onLoad设置的title会只在页面渲染之前展示,之后就显示json文件的tile,所以现在你应该明白ttle设置最优的地方就是给子文件写一个json文件,在文件中写入,如果想改变颜色直接在文件中添加就可以,该文件所写的属性值会覆盖app.json中设置的值。新建一个movie.json,
{
"navigationBarTitleText": "电影"
}
最后看下效果图
这样是不是显示标题是不是比较符合了呀!
这个方法也是网络上看的,然后自己写了个例子验证了一下,在这个跟大家分享下。