uni-app 字节跳动小程序使用page-meta设置背景 开发工具有报错 uni.setBackgroundColor is not a function
uni-app 字节跳动小程序使用page-meta设置背景 开发工具有报错 uni.setBackgroundColor is not a function
示例代码：
<template>
<page-meta :page-style="pageStyle"></page-meta>
<view>
</view>
</template>
<script>
export default {
data() {
return {
utype: 0
};
},
computed: {
pageStyle() {
var background = '#FFFFFF';
if(this.utype > 0){
background = '#f3f3f3';
}
return 'background-color: ' + background;
}
}
}
</script>
操作步骤：
有代码，照着编译运行
预期结果：
功能正常
实际结果：
功能异常
bug描述：
头条小程序使用page-meta设置背景，头条开发工具看有报错：uni.setBackgroundColor is not a function
这是编译问题吧，头条里的api应该是tt.开头的
更多关于uni-app 字节跳动小程序使用page-meta设置背景 开发工具有报错 uni.setBackgroundColor is not a function的实战教程也可以访问 https://www.itying.com/category-93-b0.html
7 回复
收到，这边排查下
更多关于uni-app 字节跳动小程序使用page-meta设置背景 开发工具有报错 uni.setBackgroundColor is not a function的实战教程也可以访问 https://www.itying.com/category-93-b0.html
Bug已确认，当前版本解决方案打开 HBuilderX\plugins\uniapp-cli\node_modules@dcloudio\uni-cli-shared\components\page-meta.vue，参考下面的截图
这是字节跳动小程序平台的API差异导致的。uni-app在编译到字节跳动小程序时，page-meta组件内部会调用uni.setBackgroundColor，但字节跳动小程序平台的实际API是tt.setBackgroundColor。
解决方案：
- 条件编译处理： 在App.vue或页面中，通过条件编译针对字节跳动小程序平台进行特殊处理：
// 在App.vue的onLaunch中
onLaunch() {
// #ifdef MP-TOUTIAO
uni.setBackgroundColor = tt.setBackgroundColor
// #endif
}
- 使用页面样式替代： 对于简单的背景色设置，可以直接在页面的style中设置：
page {
background-color: #FFFFFF;
}
或者在页面组件的style中：
/* 页面组件 */
:host {
background-color: #FFFFFF;
}