3lang3 / react-vant

React mobile UI Components base on Vant
https://react-vant.3lang.dev
MIT License
1.31k stars 186 forks source link

🐛 [Bug]: DatetimePicker在Form中,onConfirm返回的value错误 #663

Closed xiaolong233 closed 8 months ago

xiaolong233 commented 1 year ago

Which React Vant packages are impacted?

What version of React Vant are you using?

3.3.1

Reproduce live demo(codesandebox or stackblitz)?

No response

Descripition

DatetimePicker组件在Form组件中,以Popup的方式被调用。此时,如果把Form.Itemtrigger设置为onoConfirm时,返回的value不是用户选择的日期。
通过监听DatetimePicker组件的onChangeonConfirm事件发现,如果不设置Form.Itemtrigger时,onConfirm返回的value是正确的,但如果设置为onoConfirm时,则返回的value时错误的。

const [form] = Form.useForm();
......
<Form form={form} onFieldsChange={(values) => console.log(values)}>
    <Form.Item 
            name="beginDate" 
            label="起保日期" 
            isLink 
            trigger="onConfirm" 
            onClick={(e, ref) => { 
                   ref?.current?.open(); 
            }}
    >
        <DatetimePicker 
                title="选择起保日期" 
                type="date" 
                popup 
                onChange={(value: Date) => console.log(value)} 
                onConfirm={(value: Date) => console.log(value)}
        >
                {(value: Date) => (value ? moment(value).format('yyyy-MM-DD') : '请选择起保日期')}
        </DatetimePicker>
    </Form.Item>
</Form>

效果图: 1 调试输出: 2

day-xue commented 8 months ago

感觉可以包一层 把传下来的onchange 事件在onConfirm 调用一次