uni-app：顶部标题栏的部分相关设置（标题更改， 加载效果）

一、标题更改 

效果

方法一：在pages.json中进行修改

{
	"path": "pages/index/index",
	"style": {
		"navigationBarTitleText": "自定义标题"
	}
},

方法二：在页面直接进行修改

onLoad() {
	// 设置页面的标题栏名称
	uni.setNavigationBarTitle({
		title: '自定义标题'
	});
}

一般可以用于当页面标题为上一个页面传来的参数时可以很好的使用，如下：

onLoad(options) {
	console.log(options.name)//获取到页面的参数
	// 设置页面的标题栏名称
	uni.setNavigationBarTitle({
		title: options.name//将参数作为标题
	});
}

二、顶部标题栏-页面加载效果

效果

代码

这里是先进行加载，一秒后进行关闭

onLoad() {
	// 设置页面的标题栏名称
	uni.setNavigationBarTitle({
		title: '自定义标题'
	});
	// 显示加载状态
	uni.showNavigationBarLoading();
	setTimeout(() => {
		// 隐藏加载状态
		uni.hideNavigationBarLoading();
	}, 1000)
	
}