您的当前位置：首页正文

使用文本域添加的信息，H5页面数据不换行

来源：爱go旅游网

项目场景：

在管理后台使用文本域配置数据，H5页面展示的信息不换行

问题描述

在管理后台使用文本域添加信息时换行了，但是H5页面展示的信息不换行

原因分析：

解决方案：

1、使用css处理
在结果所在的 div 的 css 设置：
white-space: pre-line;
然后页面就能成功识别 ‘\n’ ，并换行显示

2、定义方法正则替换

//定义方法
//var pretext='第一行\n\n第二行'
preText (pretext) {
    return pretext.replace(/\r\n/g, '<br/>').replace(/\n/g, '<br/>').replace(/\s/g, ' ')
}
//使用（react）
<div dangerousSetInnerHTML={{__html: this.preText(textCotent)}}/>

因篇幅问题不能全部显示，请点此查看更多更全内容

查看全文