Reproduction link <a href="https://codesandbox.io/p/sandbox/antd-r

抱歉 4.x 已经过了维护期，不再提供支持了 <a href="https://ant-design.antgroup.com/docs/blog/v4-ood-c

RangePicker 无法变成受控且 onCalendarChange 无法正确执行 form.setFieldValue about ant-design HOT 6 OPEN

BrunaDeLafel commented on July 19, 2024

RangePicker 无法变成受控且 onCalendarChange 无法正确执行 form.setFieldValue

from ant-design.

Comments (6)

ouy-o3o commented on July 19, 2024 1

我不太理解onCalendarChange这个方法的调用时机，我一直无法触发它，以及你想要实现的效果看起来是只能选择开始时间自动设置结束时间为三年后,

 onValuesChange={(params) => {
        const key = Object.keys(params)?.[0];
        if ("validityDate" === key) {
          form.setFieldValue("validityDate", [
            params.validityDate[0],
            moment(params.validityDate[0]).add(3, "years"),
          ]);
        }
      }}

在form上设置这个方法可以帮到你吗

from ant-design.

ouy-o3o commented on July 19, 2024

disabled 是会被formItem影响
state的值没有被回显是因为设置的是defaultValue，受控需要在onValueChange或者useeffect 里依赖state 使用form对{[name]:value}赋值

from ant-design.

BrunaDeLafel commented on July 19, 2024

disabled 是会被formItem影响

state的值没有被回显是因为设置的是defaultValue，受控需要在onValueChange或者useeffect 里依赖state 使用form对{[name]:value}赋值

貌似在onCalendarChange中使用form.setFieldValue(‘validityDate’, xxx) 也赋值不了, 也是因为form.item 有了initialValue的缘故么

from ant-design.

BrunaDeLafel commented on July 19, 2024

disabled 是会被formItem影响

state的值没有被回显是因为设置的是defaultValue，受控需要在onValueChange或者useeffect 里依赖state 使用form对{[name]:value}赋值

我这么使用也是无效的, 去掉disabled=[false, true]属性就可以

from ant-design.

BrunaDeLafel commented on July 19, 2024

我不太理解onCalendarChange这个方法的调用时机，我一直无法触发它，以及你想要实现的效果看起来是只能选择开始时间自动设置结束时间为三年后,
 onValuesChange={(params) => {
        const key = Object.keys(params)?.[0];
        if ("validityDate" === key) {
          form.setFieldValue("validityDate", [
            params.validityDate[0],
            moment(params.validityDate[0]).add(3, "years"),
          ]);
        }
      }}
在form上设置这个方法可以帮到你吗
我尝试尝试