diff --git a/src/tag-input/__tests__/vitest-tag-input.test.jsx b/src/tag-input/__tests__/vitest-tag-input.test.jsx
index d73b47a168..a7db2dccb5 100644
--- a/src/tag-input/__tests__/vitest-tag-input.test.jsx
+++ b/src/tag-input/__tests__/vitest-tag-input.test.jsx
@@ -163,6 +163,16 @@ describe('TagInput Component', () => {
const wrapper3 = render();
const container3 = wrapper3.container.querySelector('.t-input');
expect(container3.querySelector(`.${'t-is-readonly'}`)).toBeFalsy();
+ // readonly = false backspace able
+ const onRemoveFn = vi.fn();
+ const wrapper4 = getTagInputValueMount(TagInput, { readonly: false }, { onRemove: onRemoveFn });
+ fireEvent.keyDown(wrapper4.container.querySelector('input'), { key: 'Backspace', code: 'Backspace', charCode: 8 });
+ expect(onRemoveFn).toHaveBeenCalled();
+ // readonly = false backspace disable
+ const onRemoveFnUn = vi.fn();
+ const wrapper5 = getTagInputValueMount(TagInput, { readonly: true }, { onRemove: onRemoveFnUn });
+ fireEvent.keyDown(wrapper5.container.querySelector('input'), { key: 'Backspace', code: 'Backspace', charCode: 8 });
+ expect(onRemoveFnUn).not.toHaveBeenCalled();
});
it('props.readonly: readonly TagInput does not need clearIcon', async () => {
diff --git a/src/tag-input/useTagList.tsx b/src/tag-input/useTagList.tsx
index e37b1a9861..2066100780 100644
--- a/src/tag-input/useTagList.tsx
+++ b/src/tag-input/useTagList.tsx
@@ -57,7 +57,7 @@ export default function useTagList(props: TagInputProps) {
// 按下回退键,删除标签
const onInputBackspaceKeyDown = (value: InputValue, context: { e: KeyboardEvent }) => {
const { e } = context;
- if (!tagValue || !tagValue.length) return;
+ if (!tagValue || !tagValue.length || readonly) return;
// 回车键删除,输入框值为空时,才允许 Backspace 删除标签
if (!value && ['Backspace', 'NumpadDelete'].includes(e.key)) {
const index = tagValue.length - 1;