从函数调用函数

Question

我有以下代码段，用于设置/格式化价格并获取从依赖项升级中重构的值。

我需要将表单中的值传递到 amountOnBlur 函数，但不确定如何进行，因为依赖项上的模糊函数仅接受 e 类型：(FocusEvent & {target: HTMLInputElement | HTMLTextAreaElement})

请帮忙

export const amountOnBlur =
  ({
     setAmount,
     currencyFormatting,
     paymentMethods,
     setPaymentMethod,
     setUserAmount,
     setError,
   }: {
    setAmount: Setter;
    currencyFormatting: CurrencyFormatting;
    paymentMethods: VendorPaymentMethod;
    setUserAmount: Setter;
    setPaymentMethod: Setter;
    setError: Setter;
  }) =>
    ({ value }: { value: string }): void => {
      const amount = formatValueAsCurrency(value, '', currencyFormatting);
      const { decimalPlaces, maxDp } = currencyFormatting;
      const userAmount = formatValueAsCurrency(value, '', {
        comma: false,
        decimalPlaces,
        maxDp,
      });

      setUserAmount(userAmount);
      setAmount(amount);

      const error = validAmountCurrency(value, currencyFormatting)
        ? ''
        : ERROR_POSITIVE_ONLY;

      setError(error);
      setDefaultPaymentMethod(paymentMethods, value, setPaymentMethod);
    };

我已将 ui 上的函数重构为下面的函数，但我无法将值传递给 amountOnBlur 函数。

   //my question would be how to pass the value to amountOnBlur from onChangeReference
  const onChangeReference = (e: (FocusEvent & {target: HTMLInputElement | HTMLTextAreaElement})) => {
        const value = e.target.value
        amountOnBlur({
            currencyFormatting,
            paymentMethods,
            setAmount,
            setError,
            setPaymentMethod,
            setUserAmount,
        })
    };
  return (
    <IField
      error={error}
      inline
      inputGroup
      join
      label="Amount"
      rangeUnderflow={ERROR_MIN_VALUE}
    >
      <IInput
        data-testid="amount-currency"
        name="amount"
        onBlur={onChangeReference} //cannot use amountOnBlur due to mismatch types.
        onFocus={displayUserValue(userAmount, setAmount)}
        required
        type={IInput.Type.Text}
        value={amount}
      >
        <span slot="append">{currency}</span>
      </IInput>
    </IField>
  );

Answer 1

const onChangeReference = (e: FocusEvent & { target: HTMLInputElement | HTMLTextAreaElement }) => {
    const value = e.target.value;
    amountOnBlur({
      setAmount,
      currencyFormatting,
      paymentMethods,
      setPaymentMethod,
      setUserAmount,
      setError,
    })({ value }); 
  };
  
  return (
    <IField
      error={error}
      inline
      inputGroup
      join
      label="Amount"
      rangeUnderflow={ERROR_MIN_VALUE}
    >
      <IInput
        data-testid="amount-currency"
        name="amount"
        onBlur={onChangeReference}
        onFocus={displayUserValue(userAmount, setAmount)}
        required
        type={IInput.Type.Text}
        value={amount}
      >
        <span slot="append">{currency}</span>
      </IInput>
    </IField>
  );