- 发布:2022-06-23 09:49
- 更新:2022-06-24 11:46
- 阅读:1015
产品分类: uniapp/App
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 12.3.1 (21E258)
HBuilderX类型: 正式
HBuilderX版本号: 3.4.15
手机系统: 全部
页面类型: nvue
vue版本: vue3
打包方式: 云端
项目创建方式: HBuilderX
测试过的手机:
示例代码:
<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>
<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,运行即可复现
1、创建vue3项目
2、基于uni-nav-bar创建自定义组件app-nav-bar,包含slot
3、在nvue中引入组件
4、运行即可发现
附:已提交demo,运行即可复现
预期结果:
class生效
class生效
实际结果:
class不生效
class不生效
bug描述:
使用vue3+nvue开发app,基于uni-nav-bar自定义导航栏(自定义组件),发现了slot的问题。
问题:slot中的组件使用class不生效,style生效
感谢反馈,bug 已确认且修复,请关注后续版本发布。
-
回复 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: 我开了新贴,好几天了没人回复,能帮我看下吗?https://ask.dcloud.net.cn/question/150406?item_id=208006&rf=false
非常感谢2022-08-05 21:28