Merge pull request #458 from Mark-Fenng/main

feat(arco): expose 'setInputValue' method for Input and Textarea
This commit is contained in:
yz-yu 2022-06-19 20:32:43 +08:00 committed by GitHub
commit e121c79679
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 40 additions and 4 deletions

View File

@ -40,7 +40,11 @@ const options = {
spec: {
properties: InputPropsSpec,
state: InputStateSpec,
methods: {},
methods: {
setInputValue: Type.Object({
value: Type.String(),
}),
},
slots: {
addAfter: { slotProps: Type.Object({}) },
prefix: { slotProps: Type.Object({}) },
@ -53,7 +57,14 @@ const options = {
};
export const Input = implementRuntimeComponent(options)(props => {
const { getElement, slotsElements, customStyle, callbackMap, mergeState } = props;
const {
getElement,
slotsElements,
customStyle,
callbackMap,
mergeState,
subscribeMethods,
} = props;
const { updateWhenDefaultValueChanges, defaultValue, ...cProps } =
getComponentProps(props);
@ -77,9 +88,19 @@ export const Input = implementRuntimeComponent(options)(props => {
mergeState({ value });
callbackMap?.onChange?.();
},
[mergeState, callbackMap]
[setValue, mergeState, callbackMap]
);
useEffect(() => {
subscribeMethods({
setInputValue({ value }) {
setValue(value);
mergeState({ value });
callbackMap?.onChange?.();
},
});
}, [setValue, mergeState, callbackMap, subscribeMethods]);
return (
<BaseInput
className={css(customStyle?.input)}

View File

@ -42,7 +42,11 @@ export const TextArea = implementRuntimeComponent({
spec: {
properties: TextAreaPropsSpec,
state: TextAreaStateSpec,
methods: {},
methods: {
setInputValue: Type.Object({
value: Type.String(),
}),
},
slots: {},
styleSlots: ['TextArea'],
events: ['onChange', 'onBlur', 'onFocus', 'onClear', 'onPressEnter'],
@ -54,6 +58,7 @@ export const TextArea = implementRuntimeComponent({
customStyle,
callbackMap,
mergeState,
subscribeMethods,
} = props;
const { defaultValue, ...cProps } = getComponentProps(props);
const [value, setValue] = useStateValue(
@ -70,6 +75,16 @@ export const TextArea = implementRuntimeComponent({
}
}, [getElement, ref]);
useEffect(() => {
subscribeMethods({
setInputValue({ value }) {
setValue(value);
mergeState({ value });
callbackMap?.onChange?.();
},
});
}, [setValue, mergeState, callbackMap, subscribeMethods]);
return (
<BaseTextArea
ref={ref}