背景:有些時(shí)候我們用Textarea輸入內(nèi)容并提交后,想在回顯的時(shí)候按照當(dāng)時(shí)輸入的格式回顯(換行骤视,空格等等)
但是愕提,react 項(xiàng)目是 JSX 語法锐墙,JSX 防注入攻擊使得大括號里的html代碼全部變成字符串進(jìn)行渲染,無法按照你想象的樣子回顯
網(wǎng)上解決方法:
<div dangerouslySetInnerHTML = {{__html:接口返回的值(包括html代碼)}} ></div>
經(jīng)過測試這樣子也不行,還是要在整個(gè)div外邊加上<pre></pre>標(biāo)簽的铜涉,如下:
<pre><div dangerouslySetInnerHTML = {{__html:接口返回的值(包括html代碼)}} ></div></pre>
解釋:
(1)dangerouslySetInnerHTMl 是React標(biāo)簽的一個(gè)屬性
(2)第一{}代表jsx語法開始智玻,第二個(gè)是代表dangerouslySetInnerHTML接收的是一個(gè)對象鍵值對
(3)可以插入DOM,也可以插入字符串