rc-editor-plugin-basic-style@0.3.6

editor-plugin-basic-style ui component for react

// use jsx to render html, do not modify simple.html

import 'rc-editor-plugin-basic-style/assets/index.css';
import { EditorCore, Toolbar, GetHTML, toEditorState } from 'rc-editor-core';
import 'rc-editor-core/assets/index.css';
import EditorPluginBasicStyle from 'rc-editor-plugin-basic-style';
import React from 'react';
import ReactDOM from 'react-dom';
import 'rc-select/assets/index.css';

const plugins = [EditorPluginBasicStyle];
const toolbars = [['fontSize', '|',
  'fontColor',
  'bold', 'italic', 'underline', 'strikethrough', '|',
  'superscript', 'subscript', '|',
  'align-justify', 'align-left', 'align-right', 'align-middle']];

function onChange(editorState) {
  console.log(GetText(editorState));
}
const Editor = React.createClass({
  getInitialState() {
    return {
      html: '',
    };
  },
  onChange(editorState) {
    this.setState({
      html: GetHTML(editorState),
    });
  },
  render() {
    return (<div>
      <div dangerouslySetInnerHTML={{__html: this.state.html}}></div>
      <EditorCore
        ref="editor"
        plugins={plugins}
        pluginConfig={{prefixCls: 'rc'}}
        toolbars={toolbars}
        onChange={this.onChange}
        defaultValue={toEditorState('12312313123 [色眯眯] 123 13')}
        onBlur={() => console.log('onBlur')}
      />
    </div>);
  }
})
ReactDOM.render(<Editor />, document.getElementById('__react-content'));

Fork me on GitHub