長沙品牌網(wǎng)站建設(shè)市場監(jiān)督管理局官網(wǎng)
后端返回的數(shù)據(jù):
上面圈著的部分就是\n,前端需要將數(shù)據(jù)進行換行,對于這類型的數(shù)據(jù),在前端頁面是需要進行稍微處理才能正常顯示。如果沒有經(jīng)過處理,那么內(nèi)容是不會在有換行符的位置進行換行顯示的
解決辦法1:
使用css屬性:
white-space:pre-line
或
white-space:pre-wrap
pre-wrap:連續(xù)的空白符會被保留。在遇到換行符或者< br >元素,或者需要為了填充「行框盒子(line boxes)」時才會換行
pre-line連續(xù)的空白符會被合并。在遇到換行符或者< br >元素,或者需要為了填充「行框盒子(line boxes)」時會換行
解決辦法2:
使用v-html輸出文本
v-html="xxx.replace(/\n\n/g, '<br>')"
以上兩種方法都可以實現(xiàn)