nvue 父元素 flex 子元素 flex: 1; text 下的文本不占位置

分类：nvue

nvue

<template>  
    <view class="bubble" :class="messageInfo.flow === 'out' ? 'bubble__mine' : ''">  
        <!-- 文本类型消息 -->  
        <view v-if="messageInfo.type === TIM.TYPES.MSG_TEXT" class="bubble__text bubble__style"  
         :class="messageInfo.flow === 'out' ? 'bubble__style--mine' : 'bubble__style--default'">  
            <text class="bubble__text--text">士大夫是酒店房间送士大夫是酒店房间送士大夫是酒店房间送士大夫是酒店房间送</text>  
        </view>  
    </view>  
</template>  

<style lang="scss" scoped>  
.bubble {  
    width: sizing(519);  
    @include flex(row);  
    &__style {  
        border-radius: sizing(20);  
        &--default {  
            background-color: #ffffff;  
            border-top-left-radius: 0;  
        }  
        &--mine {  
            background-color: #CFDFFF;  
            border-top-right-radius: 0;  
        }  
    }  
    &__text {  
        flex: 1;  
        padding: sizing(15) sizing(20);  
        &--text {  
            color: #333;  
            font-size: sizing(30);  
        }  
    }  
}  
</style>

2021-12-24 16:09 负责人:无分享

2 个回复

大B (作者) - 支新杰

虽然换行了但是只占了一行的位置

让我学习

你是说这样吗

<template>  
    <view class="wrapper">  
        <view class="box">  
            <text>我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我我</text>  
        </view>  
    </view>  
</template>  

<style scoped>  
    .wrapper {  
        height: 100vh;  
    }  

    .box {  
        border: 1px solid red;  
    }  
</style>

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

nvue 父元素 flex 子元素 flex: 1; text 下的文本不占位置

2 个回复

公告

相关问题

nvue 父元素 flex 子元素 flex: 1; text 下的文本不占位置

与内容相关的链接

2 个回复

公告

相关问题