vue.js - elementUI如何解析/n换行符?

 

问题描述:

数据这样:carRemark: "时间段:2022-09-20至2022-10-19 车牌号:黑ACE582\n时间段:2022-08-20至2022-09-19 车牌号:黑ACE582"
下面这样展示的时候都是在一行没有解析出/n 后来我这样写<div v-html="scope.row.carRemark"></div> 还是没有显示换行 这是怎么回事?

<el-popover
  placement="right"
  trigger="hover"
>
          {{scope.row.carRemark}}
          <div slot="reference" style="overflow: hidden;text-overflow:ellipsis;color:rgb(16, 146, 239);">备注</div>
</el-popover>

 

第 1 个答案:

试试放至表单元素(input textarea)或者 <pre></pre> 标签里


 

第 2 个答案:

因为 \n 并不是有效的 html 标签。

可以 replaceAll 替换成 <br> 或者其他换行符再用v-html来输出。
当然其实用使用 split('\n') 来处理成数组使用 v-for 来输出是最好的。


前端代码评审的目的就是什么呢?:前端代码评审的目的就是什么呢