reactjs 如何添加< br/>在这种情况下使用React？

d6kp6zgx 于 2023-05-17 发布在 React

关注(0)|答案(2)|浏览(151)

在这种情况下如何添加br标签？

import './App.css';

export default function App() {
  return (
    <main>
      {`aaaa <br />bbbb`}
    </main>
  );
}

2条答案

不要使用文字字符串。

<main>
  aaaa <br/>bbbb
</main>

如果必须使用HTML字符串，可以使用dangerouslySetInnerHTML，但要知道通常不建议这样做。

<main dangerouslySetInnerHTML={{__html: 'aaaa <br />bbbb'}}/>

对于一般的用例，dangerouslySetInnerHTML应该很好。请注意，由于XSS攻击，从公共文本/字符串设置HTML是一个主要风险。

<div dangerouslySetInnerHTML={{__html: 'aaaa <br />bbbb'}} />

您也可以尝试使用此库来代替dangerouslySetInnerHTML。你可以这样做-

import parse from "html-react-parser";
parse("<main>aaaa <br />bbbb</main>")