当不同组件中的值发生变化时，将设置值反应到另一个组件

问题描述

我有两个反应输入组件，其中一个输入组件；值更改，我必须在另一个输入字段中设置相同的值。

这是我的两个输入组件。

               <div className="col-md-4">
                  <label htmlFor="saleamount">Payment </label>
                  <NumberFormat id="manualPaymentEntry" name="manualPaymentEntry" fixedDecimalScale={true} decimalScale={2} value={manualPayEntry.current} className="form-control" thousandSeparator={true} thousandsGroupStyle="lakh" onChange={(values) => {
                    const { formattedValue,value } = values;
                    handleManualPaymentEntry(value);
                  }} />
                  
                </div>
                <div className="col-md-4">
                  <label htmlFor="selectedPayment">Actual Payment</label>
                  <NumberFormat readOnly={true} fixedDecimalScale={true} decimalScale={2} value={cumulativePay} className="form-control" thousandSeparator={true} thousandsGroupStyle="lakh" />
                </div>
              </div>

当 manualPaymentEntry 发生变化时，我必须将相同的值设置为 cumulativePay

  const [cumulativePay,setCumulativePay] = useState(0);
  const manualPayEntry = useRef(0);


  useEffect(() => {
    setCumulativePay(manualPayEntry.current);
  },[manualPayEntry]);


const handleManualPaymentEntry = (value) => {
    let val = parseFloat(value);
    manualPayEntry.current = value;
  }

我已经使用manualPayEntry的useRef将当前值设置为cumulativePay，但是当manualPayEntry发生变化时它没有将值设置为cumulativePay，我总是仅获得“0”...，但 manualPayEntry 的当前值应在 cumulativePay

中反映出来

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）