在2.24.7基础库以上,组件内使用了root-portal组件,会导致自定义组件内的 css 变量失效。
使用root-portal组件:
个人信息保护指引感谢您使用青团天天赚!为了更好地保护您的权益,我们更新了《个人信息保护指引》,特此说明:1.为向您提供账户注册、兼职报名在内的基础功能,我们可能会基于具体场景收集您的个人信息。2.我们会基于您的授权为您提供更好的兼职服务,包括定位(为您提供附近的兼职职位),存储权限(更改头像、与商家沟 通)等。同意并继续不同意
// app.wxss
page {
/* theme-btn-color: 按钮文字颜色 */
/* theme-backColor: 按钮背景颜色 */
/* theme-color: 小程序主题色 */
/* salary-color:薪资文案颜色 */
/* subscribe-color:首页订阅消息按钮背景颜色 */
--theme-btn-color: #FFFFFF;
--theme-backColor: linear-gradient(180deg, #FFB200 0%, #FD6510 100%);
--theme-color: #00C583;
--salary-color: #FF8000;
--subscribe-color: #00C583;
}
// 自定义组件wxss
@import "/app.wxss";
.dialog-confirm-btn {
width: 526rpx;
height: 96rpx;
margin: 32rpx auto 24rpx;
border-radius: 96rpx;
display: flex;
font-size: 32rpx;
align-items: center;
justify-content: center;
font-weight: 500;
color: var(--theme-btn-color); // 失效
background: var(--theme-backColor); // 失效
}
基础库2.25以下正常、去掉root-portal组件也正常。
代码片段:(去掉root-portal组件、或者降低基础库版本可恢复正常)
分享个代码片段出来看看