React-draft-wysiwyg: How to change the behavior when I press enter key

[gyarasu]

Hi!

In this component, it makes new paragraph(<p>tag) to press enter key.
On the other hand, when I press shit + enter, it makes just new line(<br />tag).

I want to replace these key bind. Is it possible?
Do you have any idea?

Thanks!

[jpuri]

Hi @gyarasu ,

You can pass handleReturn as property to editor. Almost all the props of DraftJS are supported by the editor. https://draftjs.org/docs/api-reference-editor.html#handlereturn

[gyarasu]

Thanks, @jpuri .
I got it:)

[paulhan221]

@gyarasu do you have an example of successfully overwriting the handleReturn method by any chance?

[gyarasu]

@paulhan221
you can pass your own function to handleReturn.

handleReturn={this.myHandleReturn}

class MyEditor extends Component {
  constructor(props) {
    super(props);
    this.myHandleReturn = this.myHandleReturn.bind(this);
  }

  myHandleReturn(e) {
    console.log('hogehoge')
  }

  render() {
    return (
      <div>
        <div>
          <Editor
           ...
            handleReturn={this.myHandleReturn}
            ...
          />
        </div>
      </div>
    );
  }
}