fix(input): prevent onEnter event during IME composition (#5862)

* fix(input): prevent onEnter event during IME composition

- Add isComposition check in useInputEventHandler to prevent Enter key event

  during Chinese input method composition

- Pass isComposition state from useInput to useInputEventHandler

- Add test case to verify IME composition behavior

- Fixes Table filter component issue where Enter key triggers both

  IME commit and filter confirmation

* chore: stash changelog [ci skip]

---------

Co-authored-by: tdesign-bot <[email protected]>

Author: dhj-l

packages/components/input/__tests__/input.test.tsx

@@ -394,6 +394,32 @@ describe('Input Component', () => {
     expect(onEnterFn1.mock.calls[0][1].e.type).toBe('keydown');
   });
 
+  it('events.enter should not trigger during IME composition', async () => {
+    const onEnterFn = vi.fn();
+    const wrapper = mount(<Input value="text" onEnter={onEnterFn}></Input>);
+    const input = wrapper.find('input');
+
+    // 模拟中文输入法开始
+    input.trigger('compositionstart');
+    await wrapper.vm.$nextTick();
+
+    // 在输入法激活状态下按回车键，不应该触发 onEnter 事件
+    input.trigger('keydown.enter');
+    await wrapper.vm.$nextTick();
+    expect(onEnterFn).not.toHaveBeenCalled();
+
+    // 模拟中文输入法结束
+    input.trigger('compositionend');
+    await wrapper.vm.$nextTick();
+
+    // 输入法结束后按回车键，应该正常触发 onEnter 事件
+    input.trigger('keydown.enter');
+    await wrapper.vm.$nextTick();
+    expect(onEnterFn).toHaveBeenCalled(1);
+    expect(onEnterFn.mock.calls[0][0]).toBe('text');
+    expect(onEnterFn.mock.calls[0][1].e.type).toBe('keydown');
+  });
+
   it('events.focus works fine', async () => {
     const onFocusFn = vi.fn();
     const wrapper = mount(<Input onFocus={onFocusFn}></Input>);

packages/components/input/hooks/useInputEventHandler.ts

@@ -2,13 +2,16 @@ import { Ref } from 'vue';
 import { TdInputProps } from './../type';
 import { getOutputValue } from './useInput';
 
-export function useInputEventHandler(props: TdInputProps, isHover: Ref<Boolean>) {
+export function useInputEventHandler(props: TdInputProps, isHover: Ref<Boolean>, isComposition?: Ref<boolean>) {
   const handleKeydown = (e: KeyboardEvent) => {
     if (props.disabled) return;
     const { code } = e;
     const tmpValue = getOutputValue((e.currentTarget as HTMLInputElement).value, props.type);
     if (/enter/i.test(code) || /enter/i.test(e.key)) {
-      props.onEnter?.(tmpValue, { e });
+      // 修复中文输入法回车键冲突：在中文输入法激活时不触发onEnter事件
+      if (!isComposition?.value) {
+        props.onEnter?.(tmpValue, { e });
+      }
     } else {
       props.onKeydown?.(tmpValue, { e });
     }

packages/components/input/input.tsx

@@ -70,7 +70,7 @@ export default defineComponent({
 
     const { inputPreRef } = useInputWidth(props, inputRef, innerValue);
 
-    const inputEventHandler = useInputEventHandler(props, isHover);
+    const inputEventHandler = useInputEventHandler(props, isHover, isComposition);
 
     const tPlaceholder = computed(() => props.placeholder ?? globalConfig.value.placeholder);
     const inputAttrs = computed(() => {

packages/tdesign-vue-next/.changelog/pr-5862.md

@@ -0,0 +1,6 @@
+---
+pr_number: 5862
+contributor: dhj-l
+---
+
+- fix(Input): 修复中文输入法激活时不触发 `onEnter` 事件的问题 @dhj-l ([#5862](https://github.com/Tencent/tdesign-vue-next/pull/5862))