lundi 14 février 2022

Check box checked property is not updating on initial check

I have below code where I am checking or unchecking the checkbox based on some conditions, and I came across an issue where I am trying to check the checkbox, and it is failing the first time and from the second time onwards works perfectly,

export const AntdDefaultOverrideInputNumberAdapter = ({
  input: { onChange, value },
  disabled,
  defaultValue,
  formatter,
  ...rest
}) => {
  const [isDefaultValueOverriden, setIsDefaultValueOverriden] = useState(
    !!value && value !== defaultValue
  );

  const handleCheckboxChange = () => {
    const hasOverride = !isDefaultValueOverriden;
    setIsDefaultValueOverriden(hasOverride);
    onChange(hasOverride && !!value ? value : defaultValue);
  };

  const handleOverrideChange = (v) => {
    onChange(v);
  };

  return (
    <Badge
      offset={[0, -6]}
      count={
        <div>
            <Checkbox
              disabled={disabled}
              checked={isDefaultValueOverriden}
              onChange={handleCheckboxChange}
              style=
            />
        </div>
      }
    >
      <InputNumber
        size="small"
        onChange={handleOverrideChange}
        disabled={disabled || !isDefaultValueOverriden}
        style=
        value={isDefaultValueOverriden ? value : defaultValue}
        formatter={formatter}
        {...rest}
      />
    </Badge>
  );
};

I am not sure where I am wrong with the above code, The problem only appears on trying to check the checkbox the first time, and it disappears from the second time onwards..

Could anyone suggest any idea on this? Many thanks in advance!!

I am using "ANTD" library for checkbox




Aucun commentaire:

Enregistrer un commentaire