Browse Source

fix: prevent trigger submit when press enter in tagInput which using in form, close #767 (#789)

pointhalo 3 years ago
parent
commit
78aa6ea6ef

+ 5 - 2
packages/semi-foundation/tagInput/foundation.ts

@@ -83,8 +83,11 @@ class TagInputFoundation extends BaseFoundation<TagInputAdapter> {
             tagsArray
         } = this._adapter.getStates();
         const code = e.keyCode;
-        if (code === keyCode.ENTER && inputValue !== '') {
-            this._handleAddTags(e);
+        if (code === keyCode.ENTER) {
+            e.preventDefault(); // prevent trigger submit when using in form
+            if (inputValue !== '') {
+                this._handleAddTags(e);
+            }
         }
         const { length } = tagsArray;
         if (code === keyCode.BACKSPACE && inputValue === '' && length > 0) {

+ 1 - 1
packages/semi-ui/checkbox/_story/checkbox.stories.js

@@ -754,7 +754,7 @@ export const CheckboxGroupCardStyle = () => (
       >
         多选框标题
       </Checkbox>
-    </CheckboxGroup> */}
+    </CheckboxGroup>
   </>
 );
 

+ 14 - 1
packages/semi-ui/tagInput/_story/tagInput.stories.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Toast, Icon, Button, Avatar } from '@douyinfe/semi-ui/';
+import { Toast, Icon, Button, Avatar, Form } from '@douyinfe/semi-ui/';
 import TagInput from '../index';
 import { IconGift, IconVigoLogo } from '@douyinfe/semi-icons';
 const style = {
@@ -412,3 +412,16 @@ export const PrefixSuffix = () => (
 PrefixSuffix.story = {
   name: 'prefix / suffix',
 };
+
+
+export const TagInputInForm = () => (
+  <>
+    <Form onSubmit={() => Toast.info('123')}>
+      <TagInput showClear />
+    </Form>
+  </>
+);
+
+PrefixSuffix.story = {
+  name: 'TagInputInForm'
+};