文字长度过长显示省略号的样式设置方法众所周知：
<!-- 单行显示省略号 -->.css {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}<!-- 多行显示省略号 -->.css2 {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;text-overflow: ellipsis;overflow: hidden;}
然而在弹性盒子模型中发现在添加white-space: nowrap;属性后，宽度自适应部分失效了，导致过长的文本撑开了布局，进而布局撑出了屏幕外。虽然省略号显示了，但是父元素的自适应宽度完全失效了。
经过搜索排查分析，发现是display: flex;影响的white-space: nowrap;会影响flex布局下未设定宽度的元素，所以给设置了display: flex;的父元素设置一下min-width:0即可解决问题。
代码如下：
.item-content-container {//父display: flex;flex: 1;flex-direction: column;box-sizing: border-box;padding: 32rpx 0 32rpx 0rpx;border-bottom: 1px solid $color_border_divider;min-width: 0; //处理因white-space: nowrap 导致宽度失效的问题.content {//子// display: flex; //这里需要注释掉box-sizing: border-box;font-size: $text_size_24;color: $color_text_primary;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}}
本文参考：/Flowering_Vivian/article/details/110377201
