constructor(props) {
super(props);
this.editorElem = React.createRef();
}
react 中 初始化 wangeditor
componentDidMount() {
this.initWangEditor();
}
配置wangeditor
initWangEditor() {
const elem = this.editorElem.current;
const editor = new E(elem);
this.editor = editor;
editor.customConfig.menus = [
'head', // 标題
'bold', // 粗體
'fontSize', // 字号
// 'fontName', // 字型
'italic', // 斜體
'underline', // 下劃線
'strikeThrough', // 删除線
'foreColor', // 文字顔色
// 'backColor', // 背景顔色
// 'link', // 插傳入連結接
'list', // 清單
'justify', // 對齊方式
'quote', // 引用
// 'emoticon', // 表情
'image', // 插入圖檔
// 'table', // 表格
// 'video', // 插入視訊
// 'code', // 插入代碼
'undo', // 撤銷
'redo', // 重複
];
editor.create();
}
如何設定及讀取wangeditor編輯内的圖文内容:
// 讀取文章内容
this.editor.txt.html();
// 設定文章内容
this.editor.txt.html('文章内容')