【报Bug】vue3 nvue 页面样式无法修改

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： win10专业版 21H1

HBuilderX类型：正式

HBuilderX版本号： 3.4.14

手机系统： Android

手机系统版本号： Android 6.0

手机厂商：模拟器

手机机型：华为

页面类型： nvue

vue版本： vue3

打包方式：云端

项目创建方式： HBuilderX

示例代码：

<view class="common-view">  
            <text class="common-view-label">详细位置</text>  
            <text  
                class="common-view-content">{{'四川省成都市龙泉驿区四川省成都市龙泉驿区四川省成都市龙泉驿区'}}</text>       
        </view>

.common-view {  
        flex-direction: row;  
        margin-left: 30rpx;  
        padding: 30rpx 30rpx 30rpx 0;  

        &-column {  
            flex-direction: column;  
        }  

        &-content{  
                        flex: 1;  
                        font-weight: bold;  
                        text-align: right;  
            flex-wrap: wrap;  
        }  
    }

操作步骤：

粘贴代码示例里的代码在nvue页面中

预期结果：

第二个text的内容可以自动换行

实际结果：

第二个text的内容不会自动换行

bug描述：

app上第二个text的内容无法换行,会一直往右边排列,h5则是正常的

2022-06-10 18:04 负责人:无分享

1 个回复

[已删除] (作者)

找到原因了,,,需要在设置了flex-direction: row;的元素上设置align-items: flex-start才可以换行....

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

【报Bug】vue3 nvue 页面样式无法修改

操作步骤：

粘贴代码示例里的代码在nvue页面中

预期结果：

第二个text的内容可以自动换行

实际结果：

第二个text的内容不会自动换行

bug描述：

1 个回复

公告

相关问题

【报Bug】vue3 nvue 页面样式无法修改

操作步骤： 粘贴代码示例里的代码在nvue页面中

预期结果： 第二个text的内容可以自动换行

实际结果： 第二个text的内容不会自动换行

bug描述：

相关链接 ：

与内容相关的链接

1 个回复

公告

相关问题

操作步骤：

粘贴代码示例里的代码在nvue页面中

预期结果：

第二个text的内容可以自动换行

实际结果：

第二个text的内容不会自动换行

相关链接：