前端 vue，后端来的数据里带 \n，希望有换行的效果，已经设置 white-space: pre-wrap 但不起效。

This topic created in 2105 days ago, the information mentioned may be changed or developed.

求助为啥不起效？我看网上说这个设置了就 OK 了啊。多谢！

pre-wrap

Vue

设置

求助

3 replies • 2021-01-16 00:57:25 +08:00

1KN6sAqR0a57no6s

Jan 16, 2021

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="xx" style="white-space: pre-line;"></div>

<script>
let xx = document.getElementById("xx");
xx.innerHTML = "123\n456";
</script>
</body>
</html>

参考 https://www.jianshu.com/p/a580568e0055

dengshen

Jan 16, 2021 via iPhone

v-html 用这个指令能解析 html 语法

gzlock

Jan 16, 2021

也可以用 pre 试试嘛
https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/pre