react ant-design 使用ueditor

前端之家收集整理的这篇文章主要介绍了react ant-design 使用ueditor前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

1.页面引入

<script type="text/javascript" src="http://localhost:8080/HBBKCOM/content/chajian/ueditor/editor_config.js"></script>
<script type="text/javascript" src="http://localhost:8080/HBBKCOM/content/chajian/ueditor/editor_api.js"></script>

2.页面引入了js 但是UE变量不能直接使用 可以写段js来绑定一下 如

<script type="text/javascript">
Date.prototype.UE=UE ;

</script>

3.自定义控件ueditor.js

import React,{ Component } from 'react';
class Ueditor extends Component {
componentDidMount(){
var UE=new Date().UE;
try{UE.getEditor(this.props.id).destroy();}catch(err){}//再次初始化有问题 要销毁原来的
var editor = UE.getEditor(this.props.id,{
lang:"zh-cn",initialFrameHeight: this.props.height,initialFrameWidth: '100%'
});
var me = this;
editor.ready( function( ueditor ) {
var value = me.props.value?me.props.value:'<p></p>';
editor.setContent(value);
});
}
render(){
return (
<div id={this.props.id}></div>
)
}
}
export default Ueditor;


使用

<Ueditor value="" id="content" height="200" />

猜你在找的React相关文章