uni-app 【报Bug】vue3模式下导航栏设置type为float时,设置backgroundColor为rgba的透明值无效

uni-app 【报Bug】vue3模式下导航栏设置type为float时,设置backgroundColor为rgba的透明值无效

开发环境 版本号 项目创建方式
Windows 10 HBuilderX

示例代码:

"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages  
    {  
        "path": "pages/index/index",  
        "style": {  
            "navigationStyle":"default",  
            "app-plus":{  
                "titleNView":{  
                    "backgroundColor":"rgba(0,0,0,0.5)",  
                    "type": "float",  
                    "titleColor": "#000",  
                    "titleSize":"30rpx",  
                    "titleText":"动态",  
                    "titleAlign":"left"  
                }  
            }  
        }  
    }  
]

操作步骤:

创建一个默认模板的uni-app项目。在pages.json配置如上图设置。在manifest.json分别以vue2和vue3版本运行至手机端。

预期结果:

vue2上rgba显示正常

实际结果:

vue3模式下backgroundColor为rgba时无效

bug描述:

pages.json配置

"pages": [ //pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages  
    {  
        "path": "pages/index/index",  
        "style": {  
            "navigationStyle":"default",  
            "app-plus":{  
                "titleNView":{  
                    "backgroundColor":"rgba(0,0,0,0.5)",  
                    "type": "float",  
                    "titleColor": "#000",  
                    "titleSize":"30rpx",  
                    "titleText":"动态",  
                    "titleAlign":"left"  
                }  
            }  
        }  
    }  
]

更多关于uni-app 【报Bug】vue3模式下导航栏设置type为float时,设置backgroundColor为rgba的透明值无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

8 回复

问题已记录,后续优化,已加分 ,感谢您的反馈!

更多关于uni-app 【报Bug】vue3模式下导航栏设置type为float时,设置backgroundColor为rgba的透明值无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


nvue vue3 setup 下 也还是不行 Android 真机运行

回复 bctop: type = float下 backgroundColor 这个属性会失效 无论 #333 还是 rgba

测试了一下还未解决

回复 bctop: #333333试下,目前限制 #后跟6位数字或字母,后续会优化

回复 DCloud_UNI_WZF: 嗯 是的 如你所说 ”#000000“ 是可以的。但 'rgba(0,0,0,0)'无效

我发现 可以配置 float后 在 onLoad钩子 函数里通过 uni.setNavigationBarColor({
backgroundColor: ‘rgba(0,0,0,0)’
}) 使titleNview背景透明生效

HBuilder X 3.6.9-alpha已修复

回到顶部