也可以用富文本保留文本格式  恰逢场景需要且能使代码简洁故用css实现

white-space:xxx;

white-space: pre-line;

连续的空白符会被合并。在遇到换行符或者<br>元素，或者需要为了填充「行框盒子(line boxes)」时会换行。

 white-space: pre;

连续的空白符会被保留。在遇到换行符或者<br>元素时才会换行。 

white-space: pre-wrap;

连续的空白符会被保留。在遇到换行符或者<br>元素，或者需要为了填充「行框盒子(line boxes)」时才会换行 

 

<div class="key fs_0">交付备注</div><div class="val mw80" :class="{ 'line-1': !isShowPay, 'text-pre': isShowPay }">{{ state.info.remark || "-" }}</div><div class="text-btn ml24 fr_c cp" @click="isShowPay = true" v-if="!isShowPay">展开<el-icon class="elIcon"><ArrowDown /></el-icon></div><div class="text-btn ml24 fr_c cp" @click="isShowPay = false" v-else>收起<el-icon class="elIcon"><ArrowUp /></el-icon></div>
</div>

 

 .text-pre {white-space: pre-wrap;}