通过state控制是否渲染编辑器子组件,只为false时,只消失一部分

#1

通过this.state.is_reply值判断是否加载组件,子组件编辑器用的simplemde

{this.state.is_reply && this.renderEidtor()}
<Fragment>
      <Editor getContent={this.setContent} onRef={this.onRef} />
        <Flex justify="end">
          <Button
            style={{ marginRight: "10px" }}
            type="ghost"
            inline
            size="small"
            onClick={this.handleClick}
          >
            发布
          </Button>
        </Flex>
    </Fragment>
import React, { PureComponent, Fragment } from "react";
import SimpleMDE from "simplemde";
import "simplemde/dist/simplemde.min.css";
class Edtior extends PureComponent {

  componentDidMount() {
    this.props.onRef(this)
    this.simplemde = new SimpleMDE({
      element: document.getElementById("editor"),
      placeholder: "Type here..."
    });

    this.simplemde.codemirror.on("change", ()=>{
      // console.log(this.simplemde.value());
      let content = this.simplemde.value();
      this.props.getContent(content);
    });
  }

  clearEditor = () => {
    this.simplemde.value('')
  }

  render() {
    return (
      <Fragment>
        <textarea id="editor" />
      </Fragment>
    );
  }
}

export default Edtior;