uni-app 设置页面背景颜色

在基于 uni-app 的应用开发过程中我们经常需要设置页面的背景颜色，因 nvue 平台与 vue 平台有所差异，将每个平台的设置方法分享给大家。

nvue 模式

nvue 可以通过 page.json 来设置页面背景颜色

{
	"pages": [
		{
		    "path" : "pages/test/test",
		    "style" :                                                                                    
		    {
		        "navigationBarTitleText": "页标题",
				// 设置页面背景色
				"app-plus" : {
					"background":"#FF0000"
				}
			}
		},
		......
	]
}

vue 模式

在页面 style 中修改 page 背景样式即可，注意不能使用 scoped，其他页面样式使用2个独立的 style 标签来实现。

如 : index.vue

<style>
/* #ifndef APP-NVUE */
page{background-color: #3688FF;}
/* #endif */
</style>
<style scoped>
.red{color: red;}
</style>