码农朱哲
码农朱哲
  • 发布:2022-06-23 09:49
  • 更新:2022-06-24 11:46
  • 阅读:1015

【报Bug】vue3 + nvue下,自定义组件中,slot中使用class不生效

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: 12.3.1 (21E258)

HBuilderX类型: 正式

HBuilderX版本号: 3.4.15

手机系统: 全部

页面类型: nvue

vue版本: vue3

打包方式: 云端

项目创建方式: HBuilderX

测试过的手机:

iOS: iphone 7 plus, 15.5 Android: Redmi Note 9 Pro , MIUI 13.0.5, Android 12

示例代码:
<template>  
    <uni-nav-bar :backgroundColor="backgroundColor" :border="false" statusBar="true" @clickLeft="back">  
        <view style="display: flex;flex: 1;align-items: center;justify-content: center;">  
            <text style="color:black;font-size: 39rpx;font-weight: 700;text-align: center;">{{ title }}</text>  
        </view>  
        <template v-slot:left>  
            <!-- <image src="/static/icons/icon_back_black.png" style="width: 27rpx;height: 46rpx;" /> -->  
            <image src="/static/icons/icon_back_black.png" class="back" />  
        </template>  
    </uni-nav-bar>  
</template>  

<script>  
export default {  
    name: 'app-nav-bar',  
    props: {  
        title: String,  
        backgroundColor: {  
            type: String,  
            default: 'transparent'  
        }  
    },  
    methods: {  
        back() {  
            uni.navigateBack();  
        }  
    }  
};  
</script>  

<style scoped>  
.back {  
    width: 27rpx;  
    height: 46rpx;  
}  
</style>  

操作步骤:

1、创建vue3项目
2、基于uni-nav-bar创建自定义组件app-nav-bar,包含slot
3、在nvue中引入组件
4、运行即可发现

附:已提交demo,运行即可复现

预期结果:

class生效

实际结果:

class不生效

bug描述:

使用vue3+nvue开发app,基于uni-nav-bar自定义导航栏(自定义组件),发现了slot的问题。

问题:slot中的组件使用class不生效,style生效

2022-06-23 09:49 负责人:无 分享
已邀请:
码农朱哲

码农朱哲 (作者) - 一个10年+工作经验的全栈码农

demo奉上,欢迎大家测试

DCloud_UNI_WZF

DCloud_UNI_WZF

感谢反馈,bug 已确认且修复,请关注后续版本发布。

  • 码农朱哲 (作者)

    3.5.1 已确认修复,辛苦了

    2022-07-08 12:44

  • genda_0927

    回复 码农朱哲: 什么时候发布啊?

    2022-07-27 00:15

  • genda_0927

    什么时候发布新版本,项目中大部分class都不生效,swiper-item / uni-transition 等都不生效

    2022-07-27 00:43

  • DCloud_UNI_WZF

    回复 genda_0927:3.5.1 已经发布了,如果与该问题相同,请参考本帖提供详细信息及可复现demo,如不同,请开新帖反馈问题

    2022-07-27 09:20

  • genda_0927

    回复 DCloud_UNI_WZF: 是 alpha 版本发布了,正式版什么时候能发布,近期内10天左右我们项目要更新上线。

    2022-07-27 10:39

  • DCloud_UNI_WZF

    回复 genda_0927: 3.5.1 正式版预计下周发布,具体时间未确定

    2022-07-27 11:06

  • genda_0927

    回复 DCloud_UNI_WZF: Android 自定义打包,alpha版本 3.5.1 和 3.5.2 更换了 libs中的相关aar。应用无法运行啊根本(android-gif-drawable-release@1.2.23 这个aar替换后没有改动)

    2022-07-27 14:18

  • DCloud_UNI_WZF

    回复 genda_0927: 非本帖问题建议开新帖反馈,相关同事看到会回复,谢谢~

    2022-07-27 14:25

  • genda_0927

    回复 DCloud_UNI_WZF: 我开了新贴,好几天了没人回复,能帮我看下吗?https://ask.dcloud.net.cn/question/150406?item_id=208006&rf=false

    非常感谢

    2022-08-05 21:28

该问题目前已经被锁定, 无法添加新回复