react 如何渲染富文字內容

2021-10-19 01:15:36 字數 550 閱讀 9875

import react,  from 'react'; 

constructor()}

render()}

>

);}}

在react中,通過富文字編輯器進行操作後的內容,會保留原有的標籤樣式,並不能正確展示。

在顯示時,將內容寫入__html物件中即可。具體如下:

dangerouslysetinnerhtml 是react標籤的乙個屬性,類似於angular的ng-bind;

有2個},第一{}代表jsx語法開始,第二個是代表dangerouslysetinnerhtml接收的是乙個物件鍵值對;

既可以插入dom,又可以插入字串;

不合時宜的使用 innerhtml 可能會導致 cross-site scripting (xss) 攻擊。 淨化使用者的輸入來顯示的時候,經常會出現錯誤,不合適的淨化也是導致網頁攻擊的原因之一。dangerouslysetinnerhtml 這個 prop 的命名是故意這麼設計的,以此來警告,它的 prop 值( 乙個物件而不是字串 )應該被用來表明淨化後的資料。

layui 富文字內容儲存問題

早上接到產品經理的反饋 說是註冊協議的 詳情儲存以及修改報錯 馬上去檢查發現是 詳情的字段裡面還有單引號 某種字型直接複製貼上在富文字編輯器裡面 就會造成 你在後台轉義字元也還是同樣報錯 無論如何轉義都是報錯 後面再offcie編輯上修改 的內容格式字型等 再次放入富文字編輯框 成功報錯 並成功輸出...

Django之富文字(獲取內容,設定內容)

富文字 1 rich text format rtf 2 tinymce外掛程式 配置外掛程式 使用 3 在後台管理中使用 以字典形式配置富文字框架tinymce 作用於管理後台中的富文字編輯器 tinymce default config 建立模型類 from tinymce.models imp...

Taro3不使用wxParse渲染富文字

taro 可以不使用wxparse直接通過 element innerhtml 或 vue 的 v html 或 react nerv 的 dangerouslysetinnerhtml 直接渲染 html 詳細請看 這裡 但是有幾個問題需要注意 1 頁面重新render的時候dangerously...