[static-toolbar-plugin] call onChange after clicking a button

Hello,

I am using the code from the custom static toolbar example and when I click any of the draft-js-buttons or even using the key commands, the state of my editor doesn’t get updated until I actually write something.

How could I update the state of the editor after enabling any of the rich text functions? I can’t find any doc on that.

Thank you

[Wgil]

@vrinceanuv Dude not pretty sure what was wrong there.

Anyway here are a couple of methods, hope this can can be helpful.

onChange = editorState => {
    const oldContent = stateToHTML(this.state.editorState.getCurrentContent());
    const newContent = stateToHTML(editorState.getCurrentContent());
    this.setState({
      editorState
    });

    // onChange is called on mounting phase and I think that's an unwanted behavior
    // for our current use case. This way we make sure that something really changed
    // to then call our onChange prop
    if (oldContent !== newContent) {
      this.props.onChange(editorState);
    }
  };

handleKeyCommand = command => {
    const { editorState } = this.state;
    const newState = RichUtils.handleKeyCommand(editorState, command);
    if (newState) {
      this.onChange(newState);
      return "handled";
    }
    return "not-handled";
  };

Tell me how you solved it!

[vrinceanuv]

@Wgil Having the same issue, but my onChange works as expected. What have you had there? Thanks