Skip to content

Commit 131c16f

Browse files
uyarnuyarn
authored
Revert "fix: components props transmit bugs (#6052)" (#6151)
This reverts commit 65f0182.
1 parent aafbf98 commit 131c16f

File tree

21 files changed

+262
-437
lines changed

21 files changed

+262
-437
lines changed

‎packages/components/auto-complete/auto-complete.tsx‎

Lines changed: 9 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,6 @@ import {
1010
useDisabled,
1111
useReadonly,
1212
useCommonClassName,
13-
useEventForward,
1413
} from '@tdesign/shared-hooks';
1514
import AutoCompleteOptionList from './components/option-list';
1615

@@ -112,16 +111,6 @@ export default defineComponent({
112111
};
113112

114113
return () => {
115-
const inputEvents = useEventForward(innerInputProps.value, {
116-
onChange: onInputChange,
117-
onFocus: onInnerFocus,
118-
onBlur: onInnerBlur,
119-
onClear: props.onClear,
120-
onCompositionend: onInnerCompositionend,
121-
onCompositionstart: onInnerCompositionstart,
122-
onEnter: onInnerEnter,
123-
});
124-
125114
// 触发元素
126115
const triggerNode = renderContent('default', 'triggerElement') || (
127116
<TInput
@@ -133,7 +122,14 @@ export default defineComponent({
133122
disabled={isDisabled.value}
134123
autofocus={props.autofocus}
135124
clearable={props.clearable}
136-
{...inputEvents.value}
125+
onChange={onInputChange}
126+
onFocus={onInnerFocus}
127+
onBlur={onInnerBlur}
128+
onClear={props.onClear}
129+
onCompositionend={onInnerCompositionend}
130+
onCompositionstart={onInnerCompositionstart}
131+
onEnter={onInnerEnter}
132+
{...innerInputProps.value}
137133
v-slots={slots}
138134
/>
139135
);
@@ -171,9 +167,6 @@ export default defineComponent({
171167
overlayInnerClassName: popupInnerClasses.value,
172168
overlayClassName: popupClasses.value,
173169
};
174-
const popupEvents = useEventForward(popupProps, {
175-
onVisibleChange: onPopupVisibleChange,
176-
});
177170
return (
178171
<div class={classes.value}>
179172
<Popup
@@ -183,7 +176,7 @@ export default defineComponent({
183176
placement="bottom-left"
184177
hideEmptyPopup={true}
185178
content={panelContent ? () => panelContent : null}
186-
{...popupEvents.value}
179+
{...popupProps}
187180
>
188181
{triggerNode}
189182
</Popup>

‎packages/components/cascader/cascader.tsx‎

Lines changed: 45 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { defineComponent, computed } from 'vue';
2+
import { omit } from 'lodash-es';
23
import TCascaderSubPanel from './components/Panel';
34
import SelectInput from '../select-input';
45
import FakeArrow from '../common-components/fake-arrow';
@@ -21,7 +22,6 @@ import {
2122
useReadonly,
2223
usePrefixClass,
2324
useCommonClassName,
24-
useEventForward,
2525
} from '@tdesign/shared-hooks';
2626
import { useCascaderContext } from './hooks';
2727

@@ -104,38 +104,6 @@ export default defineComponent({
104104
return () => {
105105
const { setVisible, visible, inputVal, setInputVal } = cascaderContext.value;
106106

107-
const selectInputEvents = useEventForward(props.selectInputProps as TdSelectInputProps, {
108-
onTagChange: (val: CascaderValue, ctx) => {
109-
// 按 enter 键不处理
110-
if (ctx.trigger === 'enter') return;
111-
handleRemoveTagEffect(cascaderContext.value, ctx.index, props.onRemove);
112-
},
113-
onInputChange: (value) => {
114-
if (!isFilterable.value) return;
115-
setInputVal(`${value}`);
116-
},
117-
onPopupVisibleChange: (val: boolean, context) => {
118-
if (isDisabled.value) return;
119-
setVisible(val, context);
120-
},
121-
onBlur: (val, context) => {
122-
props.onBlur?.({
123-
value: cascaderContext.value.value,
124-
inputValue: context.inputValue || '',
125-
e: context.e as FocusEvent,
126-
});
127-
},
128-
onFocus: (val, context) => {
129-
props.onFocus?.({
130-
value: cascaderContext.value.value,
131-
e: context.e,
132-
});
133-
},
134-
onClear: () => {
135-
closeIconClickEffect(cascaderContext.value);
136-
},
137-
});
138-
139107
return (
140108
<SelectInput
141109
class={cascaderClassNames.value}
@@ -174,6 +142,42 @@ export default defineComponent({
174142
...(props.tagInputProps as TdCascaderProps['tagInputProps']),
175143
}}
176144
tagProps={{ ...(props.tagProps as TdCascaderProps['tagProps']) }}
145+
onInputChange={(value, ctx) => {
146+
if (!isFilterable.value) return;
147+
setInputVal(`${value}`);
148+
(props?.selectInputProps as TdSelectInputProps)?.onInputChange?.(value, ctx);
149+
}}
150+
onTagChange={(val: CascaderValue, ctx) => {
151+
// 按 enter 键不处理
152+
if (ctx.trigger === 'enter') return;
153+
handleRemoveTagEffect(cascaderContext.value, ctx.index, props.onRemove);
154+
// @ts-ignore TODO: fix bug
155+
(props?.selectInputProps as TdSelectInputProps)?.onTagChange?.(val, ctx);
156+
}}
157+
onPopupVisibleChange={(val: boolean, context) => {
158+
if (isDisabled.value) return;
159+
setVisible(val, context);
160+
(props?.selectInputProps as TdSelectInputProps)?.onPopupVisibleChange?.(val, context);
161+
}}
162+
onBlur={(val, context) => {
163+
props.onBlur?.({
164+
value: cascaderContext.value.value,
165+
inputValue: context.inputValue || '',
166+
e: context.e as FocusEvent,
167+
});
168+
(props?.selectInputProps as TdSelectInputProps)?.onBlur?.(val, context);
169+
}}
170+
onFocus={(val, context) => {
171+
props.onFocus?.({
172+
value: cascaderContext.value.value,
173+
e: context.e,
174+
});
175+
(props?.selectInputProps as TdSelectInputProps)?.onFocus?.(val, context);
176+
}}
177+
onClear={(context: { e: MouseEvent }) => {
178+
closeIconClickEffect(cascaderContext.value);
179+
(props?.selectInputProps as TdSelectInputProps)?.onClear?.(context);
180+
}}
177181
v-slots={{
178182
label: slots.label,
179183
suffix: slots.suffix,
@@ -197,7 +201,14 @@ export default defineComponent({
197201
),
198202
collapsedItems: slots.collapsedItems,
199203
}}
200-
{...selectInputEvents.value}
204+
{...omit(props.selectInputProps as TdSelectInputProps, [
205+
'onTagChange',
206+
'onInputChange',
207+
'onPopupVisibleChange',
208+
'onBlur',
209+
'onFocus',
210+
'onClear',
211+
])}
201212
/>
202213
);
203214
};

‎packages/components/color-picker/components/trigger/index.tsx‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import TInput from '../../../input';
33
import { Color, getColorObject } from '../../utils';
44
import { TdColorPickerProps } from '../../type';
55
import { useBaseClassName } from '../../hooks';
6-
import { useCommonClassName, useEventForward } from '@tdesign/shared-hooks';
6+
import { useCommonClassName } from '@tdesign/shared-hooks';
77

88
export default defineComponent({
99
name: 'DefaultTrigger',
@@ -70,12 +70,6 @@ export default defineComponent({
7070

7171
const handleClear = (context: { e: MouseEvent }) => props.onTriggerClear?.(context);
7272

73-
const inputEvents = useEventForward(props.inputProps as TdColorPickerProps['inputProps'], {
74-
onBlur: handleChange,
75-
onChange: handleChange,
76-
onClear: handleClear,
77-
});
78-
7973
return () => {
8074
const inputSlots = {
8175
label: () => {
@@ -104,7 +98,10 @@ export default defineComponent({
10498
v-slots={inputSlots}
10599
v-model={value.value}
106100
disabled={props.disabled}
107-
{...inputEvents.value}
101+
onBlur={handleChange}
102+
onChange={handleChange}
103+
onClear={handleClear}
104+
{...props.inputProps}
108105
/>
109106
);
110107
};

‎packages/components/date-picker/DatePicker.tsx‎

Lines changed: 3 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +3,7 @@ import dayjs from 'dayjs';
33
import { isFunction, isDate } from 'lodash-es';
44
import { CalendarIcon as TdCalendarIcon } from 'tdesign-icons-vue-next';
55

6-
import {
7-
useConfig,
8-
useTNodeJSX,
9-
useDisabled,
10-
useReadonly,
11-
useGlobalIcon,
12-
usePrefixClass,
13-
useEventForward,
14-
} from '@tdesign/shared-hooks';
6+
import { useConfig, useTNodeJSX, useDisabled, useReadonly, useGlobalIcon, usePrefixClass } from '@tdesign/shared-hooks';
157

168
import { useSingle } from './hooks/useSingle';
179
import { parseToDayjs, getDefaultFormat, formatTime, formatDate } from '@tdesign/common-js/date-picker/format';
@@ -351,10 +343,6 @@ export default defineComponent({
351343
onPanelClick: () => inputRef.value?.focus?.(),
352344
}));
353345

354-
const selectInputEvents = useEventForward(props.selectInputProps as TdDatePickerProps['selectInputProps'], {
355-
onClear: onTagClearClick,
356-
});
357-
358346
return () => (
359347
<div class={COMPONENT_NAME.value}>
360348
<TSelectInput
@@ -375,13 +363,14 @@ export default defineComponent({
375363
popupVisible={!isReadOnly.value && popupVisible.value}
376364
valueDisplay={() => renderTNodeJSX('valueDisplay', { params: valueDisplayParams.value })}
377365
needConfirm={props.needConfirm}
366+
{...(props.selectInputProps as TdDatePickerProps['selectInputProps'])}
378367
panel={() => <TSinglePanel {...panelProps.value} />}
379368
tagInputProps={{
380369
onRemove: onTagRemoveClick,
381370
}}
371+
onClear={onTagClearClick}
382372
prefixIcon={() => renderTNodeJSX('prefixIcon')}
383373
suffixIcon={() => renderTNodeJSX('suffixIcon') || <CalendarIcon />}
384-
{...selectInputEvents.value}
385374
/>
386375
</div>
387376
);

‎packages/components/input-number/input-number.tsx‎

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
import TButton from '../button';
99
import TInput from '../input';
1010
import props from './props';
11-
import { useEventForward, useGlobalIcon } from '@tdesign/shared-hooks';
11+
import { useGlobalIcon } from '@tdesign/shared-hooks';
1212
import { TdInputNumberProps } from './type';
1313
import useInputNumber from './hooks/useInputNumber';
1414

@@ -27,11 +27,6 @@ export default defineComponent({
2727
const { inputRef } = p;
2828
context.expose({ ...p });
2929

30-
const inputEvents = useEventForward(props.inputProps, {
31-
onChange: p.onInnerInputChange,
32-
...p.listeners,
33-
});
34-
3530
return () => {
3631
const reduceIcon =
3732
props.theme === 'column' ? <ChevronDownIcon size={props.size} /> : <RemoveIcon size={props.size} />;
@@ -63,9 +58,11 @@ export default defineComponent({
6358
label={props.label}
6459
suffix={props.suffix}
6560
tips={props.tips}
61+
{...p.listeners}
62+
{...props.inputProps}
6663
v-slots={context.slots}
6764
value={p.userInput.value}
68-
{...inputEvents.value}
65+
onChange={p.onInnerInputChange}
6966
/>
7067
{props.theme !== 'normal' && (
7168
<TButton

0 commit comments

Comments
 (0)