通用评论

index.js 2.1KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. import React, { Component } from "react";
  2. import ReactDOM from "react-dom";
  3. import { Button, Icon } from "antd";
  4. import App, { Editor } from "./App";
  5. import registerServiceWorker from "./registerServiceWorker";
  6. class Index extends Component {
  7. constructor(props) {
  8. super(props);
  9. this.state = {
  10. value: ""
  11. };
  12. this.handleChangeValue = this.handleChangeValue.bind(this);
  13. this.handleChangeSubmit = this.handleChangeSubmit.bind(this);
  14. }
  15. handleChangeValue(value) {
  16. this.setState({ value });
  17. console.log("handleChangeValue value: ", value);
  18. }
  19. handleChangeSubmit(value) {
  20. this.setState({ loading: true }, () => {
  21. setTimeout(() => {
  22. this.setState({ loading: false });
  23. }, 2000);
  24. });
  25. console.log("submit value: ", value);
  26. }
  27. render() {
  28. // 最简单的用法
  29. return (
  30. <App type={1} businessId="test">
  31. <Editor value="" />
  32. </App>
  33. );
  34. // 复杂的用户法
  35. // const props = {
  36. // type: 1,
  37. // businessId: "1",
  38. // API: "http://api.links123.net/comment/v1",
  39. // showList: true
  40. // };
  41. // const editorProps = {
  42. // showEmoji: true,
  43. // placeholder: "说点什么吧",
  44. // rows: 5,
  45. // btnLoading: this.state.loading,
  46. // btnDisable: this.state.loading,
  47. // btnSubmitText: "提交",
  48. // value: this.state.value,
  49. // onChange: v => this.handleChangeValue(v),
  50. // onSubmit: v => this.handleChangeSubmit(v),
  51. // button: (
  52. // <Button
  53. // type="primary"
  54. // ghost
  55. // // onClick={() => console.log('click btn: ', this.state.value)}
  56. // >
  57. // 自定义按钮
  58. // </Button>
  59. // ),
  60. // emojiToolIcon: <Icon type="smile" style={{ fontSize: 23 }} />,
  61. // imageToolIcon: (
  62. // <Icon type="cloud-upload-o" style={{ fontSize: 25, marginLeft: 10 }} />
  63. // )
  64. // };
  65. // return (
  66. // <App {...props}>
  67. // <Editor {...editorProps} />
  68. // </App>
  69. // );
  70. }
  71. }
  72. ReactDOM.render(<Index />, document.getElementById("root-comment"));
  73. registerServiceWorker();