react-textarea-code-editor icon indicating copy to clipboard operation
react-textarea-code-editor copied to clipboard

how to do command enter and preventing enter from being sent to code editor?

Open TheBuilderJR opened this issue 2 years ago • 7 comments

tried this to no avail

        onKeyDown={(e) => {
          if (e.key == "Enter" && (e.ctrlKey || e.metaKey)) {
            onSubmit(e);
            return false;
          }
        }}

TheBuilderJR avatar Mar 03 '23 00:03 TheBuilderJR

onKeyDown={(event) => {
+  event.preventDefault();
  console.log(">>>>");
}}

@TheBuilderJR https://codesandbox.io/embed/https-github-com-uiwjs-react-textarea-code-editor-issues-144-4yvoij?fontsize=14&hidenavigation=1&theme=dark

jaywcjlove avatar Mar 05 '23 04:03 jaywcjlove

I was looking at this package, and got the same issue. Linked codesandbox doesn't work for me (using Firefox/Linux (Pop!)) Enter events will still be sent and be added to the CodeEditor. The same onKeyDown eveent on a normal textarea works as expected though. So might be an issue with how onKeyDown is implemented on the CodeEditor?

aleda145 avatar Mar 05 '23 18:03 aleda145

https://github.com/uiwjs/react-textarea-code-editor/blob/dedfb991228e9f6687b33d70b81a6e3de300553e/src/index.tsx#L95-L99

onKeyDown={(event) => {
+  event.preventDefault();
  console.log(">>>>");
+  return true
}}

@aleda145 Maybe it can solve your problem

jaywcjlove avatar Mar 08 '23 01:03 jaywcjlove

https://github.com/uiwjs/react-textarea-code-editor/blob/dedfb991228e9f6687b33d70b81a6e3de300553e/src/index.tsx#L95-L99

onKeyDown={(event) => {
+  event.preventDefault();
  console.log(">>>>");
+  return true
}}

@aleda145 Maybe it can solve your problem

It doesn't work :/, same problem. Also tried adding event.stopPropagation();, didn't help either. My enter event is still sent to the codeEditor, creating a new line.

The following textArea works as expected for me

<textarea
  onKeyDown={(event) => {
    event.preventDefault();
  }}
></textarea>

Let me know if there anything you want from me to debug this!

Great package, I still use it! :star:

I wanted it to run a SQL query on shift+Enter and not create a new line. But changed to ctrl+space instead, works just as well :smile: !

aleda145 avatar Mar 08 '23 21:03 aleda145

Running into the same issue -- the event cannot be stopped. Any update here?

emptycrown avatar Jun 03 '23 02:06 emptycrown

Same issue.Any update?

Haiqi-Wu avatar Jun 16 '23 03:06 Haiqi-Wu

https://github.com/uiwjs/react-textarea-code-editor/blob/dedfb991228e9f6687b33d70b81a6e3de300553e/src/index.tsx#L95-L99

onKeyDown={(event) => {
+  event.preventDefault();
  console.log(">>>>");
+  return true
}}

@aleda145 Maybe it can solve your problem

Maybe I don't understand what it means, haven't solved the problem yet?

@emptycrown @Haiqi-Wu @aleda145

jaywcjlove avatar Jun 16 '23 07:06 jaywcjlove