How can I determine if the enter key was pressed? about react-quill HOT 5 CLOSED

There is a note in the README that explains that why you have to bind to onKeyUp to receive events from keys like enter, backspace or delete. Please try this and let me know.

from react-quill.

You can bind onKeyDown or onKeyUp on the element containing the editor and you'll receive an event as usual. You can wrap the editor into another component, or build a custom component using the mixin.

I want to allow a few more events on the editor, such as keypress events, but I want to hear what they would be used for before. Do you have a specific use-case?

from react-quill.

The methods onKeyDown/onKeyUp do not listen for the "enter" key button press (but they do for other keys). I just tested this by binding them to the element containing the editor.

However, I did find an alternate solution. Via the onChange method on the ReactQuill component, I can query for the "enter" key button using this statement which yields a value of 10:

delta.ops[delta.ops.length -1].insert.charCodeAt(0);

My use case is very specific. I'm allowing users to use the text editor while watching videos. When pressing letter keys the video automatically pauses. When pressing the "enter" key, the video resumes playing.

from react-quill.

It seems there is an issue where Quill prevents keydown events for enter, backspace and delete from bubbling up. But you can still receive them when using onKeyUp.

I've just pushed some "official" hooks for keypress events so that you won't have to hook them on a separate container. See also [the note about onKeyDown] in the README, which should explain the situation.

Let me know if this works for you!

from react-quill.

I just downloaded version 0.2.2, and onKeyPress does not work for me. Neither does onKeyDown.

from react-quill.