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 |