我正在寻找React的HTML编辑器,但是由于找不到任何能正常工作的东西(我只需要格式化[h64]中的文本h1,h2,h3,p,粗体和图像)
最后,我决定使用Tiny Mce,效果很好。但仅在首次打开页面时。如果我再次进入该页面。没有浏览器的支持,tinymce不会被初始化。您知道在这种情况下会触发什么反应事件。到目前为止,这是我的小包装:
/** @jsx React.DOM */ var React = require('react'); var TinyMceEditor = React.createClass({ componentDidMount: function() { var that = this; tinymce.init({ selector: "textarea.tiny-mce-editor", setup : function(editor) { editor.on('change', function(e) { that.props.onChange(editor.getContent()); }); }, plugins: [ "lists link image charmap print preview anchor", "searchreplace code fullscreen", "insertdatetime media table contextmenu paste" ], toolbar: "undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image" }); tinyMCE.get(that.props.lang + '-editor').setContent(that.props.html); }, render:function(){ return ( <div> <textarea ref="text" className="tiny-mce-editor" id={this.props.lang + '-editor'} /> </div> ) } }); module.exports = TinyMceEditor;
为了解决这个问题,我必须在卸载时删除TinyMce实例。
componentWillUnmount: function() { tinymce.remove('#' + this.props.lang + '-editor'); }