<text class="test">spends big<text>
.test {
height: 22px;
line-height: 22px;
font-size: 18px;
color: #3d3d3d;
text-align:center;
background: rgba(115, 225, 205, 0.3);
}
工程狮
- 发布：2024-08-26 19:21
- 更新：2024-08-30 10:38
- 阅读：506
【报Bug】nvue 的 vue3 版本 text 文字显示有偏差，不是水平居中，而 vue2 正常
分类：uni-app
产品分类： uniapp/App
PC开发环境操作系统： Mac
PC开发环境操作系统版本号： 13.5 (22G74)
HBuilderX类型： Alpha
HBuilderX版本号： 4.26
手机系统： Android
手机系统版本号： Android 14
手机厂商： 华为
手机机型： P40
页面类型： nvue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
分别使用 vue3 和 vue2 的 nvue 使用 text 显示英文短语
分别使用 vue3 和 vue2 的 nvue 使用 text 显示英文短语
预期结果：
vue3 和 vue2 一样文字水平对齐
vue3 和 vue2 一样文字水平对齐
实际结果：
vue3 紧靠底部，这样很影响我们软件的展示效果
vue3 紧靠底部，这样很影响我们软件的展示效果
bug描述：
使用 vue3 的 text 显示文字，字母整体偏下，不是水平居中
<text class="test">spends big<text>
.test {
height: 22px;
line-height: 22px;
font-size: 18px;
color: #3d3d3d;
text-align:center;
background: rgba(115, 225, 205, 0.3);
}如图所示，图中 p 完全靠底部，而 b 上面还有位置，g 也是紧靠底部
第一张图是 vue2 版本是显示正常的，第二张图是 vue3 版本，用红色标记了不同的位置
iOS 也是一样的情况
