react富文本使用


Version note: React 15.4.2+ and react-dom 15.4.2+ is required. Antd version at last 2.8.3 in your project is recommended.

版本號說明:react、react-dom 版本必須在15.4.2以上,Antd版本最好在2.8.3以上。

1,使用命令安裝第三方模塊

npm install react-lz-editor --save  或者 yarn add react-lz-editor 

2, 把模塊引入到自己的項目中,然后根據模塊提供的api方法進行設置,實例如下

renter(){

return (

<div>

<LzEditor
     active={true} importContent={this.state.rawContent} cbReceiver={this.receiveRaw} uploadConfig={uploadConfig} image={false} video={false} audio={false} convertFormat="raw"/>

</div>

)

}

3, api參考

配置項 類型 默認值 說明
active bool false 有更新時是否刷新
importContent string "" 編輯器顯示內容
cbReceiver function null 編輯器內容更新后的回調函數,此函數接受一個改動后的返回參數值
undoRedo bool true 是否啟用撤銷恢復功能,默認啟用
removeStyle bool true 是否啟用移除格式功能,默認啟用
pasteNoStyle bool true 是否啟用文本粘貼功能,默認啟用
blockStyle bool true 是否啟用段落樣式設置功能(H1、列表、區段等),默認啟用
alignment bool true 是否啟用文本對齊設置功能,默認啟用
inlineStyle bool true 是否啟用文字樣式設置功能(加粗、傾斜、下划線等),默認啟用
color bool true 是否啟用文字顏色設置功能,默認啟用
image bool true 是否啟用圖片上傳后插入功能,默認啟用
video bool true 是否啟用視頻上傳后插入功能,默認啟用
audio bool true 是否啟用音頻上傳后插入功能,默認啟用
urls bool true 是否啟用添加刪除鏈接功能,默認啟用
autoSave bool true 是否啟用自動保存功能,默認啟用
fullScreen bool true 是否啟用全屏功能,默認啟用
convertFormat string "html" 設置內容導入導出格式,支持html、markdown、raw三種格式,默認html
uploadConfig object null 啟用媒體上傳后插入功能時,上傳參數配置對象(上傳到七牛,無需配置uploadProps)
uploadProps object null 自定義上傳方法及上傳設置(無需配置uploadConfig,同時配置uploadConfig和uploadProps,則uploadProps優先),API請參考Antd.Upload


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM