comment/src/index.js

import React, { Component } from "react";
import ReactDOM from "react-dom";
import { Button, Icon } from "antd";
import App, { Editor } from "./App";
import registerServiceWorker from "./registerServiceWorker";

class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      value: ""
    };
    this.handleChangeValue = this.handleChangeValue.bind(this);
    this.handleChangeSubmit = this.handleChangeSubmit.bind(this);
  }

  handleChangeValue(value) {
    this.setState({ value });
    console.log("handleChangeValue value: ", value);
  }

  handleChangeSubmit(value) {
    this.setState({ loading: true }, () => {
      setTimeout(() => {
        this.setState({ loading: false });
      }, 2000);
    });
    console.log("submit value: ", value);
  }

  render() {
    const props = {
      type: 1,
      businessId: "1",
      API: "http://api.links123.net/comment/v1",
      showList: true
    };

    const editorProps = {
      showEmoji: true,
      placeholder: "说点什么吧",
      rows: 5,
      btnLoading: this.state.loading,
      btnDisable: this.state.loading,
      btnSubmitText: "提交",
      value: this.state.value,
      onChange: v => this.handleChangeValue(v),
      onSubmit: v => this.handleChangeSubmit(v),
      button: (
        <Button
          type="primary"
          ghost
          // onClick={() => console.log('click btn: ', this.state.value)}
        >
          自定义按钮
        </Button>
      ),
      emojiToolIcon: <Icon type="smile" style={{ fontSize: 23 }} />,
      imageToolIcon: (
        <Icon type="cloud-upload-o" style={{ fontSize: 25, marginLeft: 10 }} />
      )
    };

    return (
      <App {...props}>
        <Editor {...editorProps} />
      </App>
    );
  }
}

ReactDOM.render(<Index />, document.getElementById("root-comment"));
registerServiceWorker();