useState продолжает сбрасываться в initialValue при повторном рендеринге. - PullRequest
Новая
       18

useState продолжает сбрасываться в initialValue при повторном рендеринге.

0 голосов
/ 28 марта 2020

Так что мой код для экрана выглядит примерно так. У меня есть useState amount, который продолжает сбрасываться в initialValue при повторном рендеринге. У меня есть около 3 useEffects. Один из них приведен в примере кода, где я получаю сумму из базы данных и устанавливаю ее с помощью setAmount. 

const ConfirmPaymentDialog = props => {
   const getInitialVal = () => {
      console.log('Initial Amount: 0');
      return conversions.numberToBigNumber(0);
   };
   const [amount, setAmount] = useState<BigNumber>(getInitialVal());

   useEffect(() => {
       getAmountToPay();
   },[]);

   const getAmountToPay = async () => {
    const amount = await myDbModule.getAmount(customer.id);
    console.log('DB Amount: ' + amount?.toString());
    setAmount(amount || conversions.numberToBigNumber(0));
  };

   useEffect(() => {
   ...
   }, [isInputTextFocused])

  console.log('Rendering');
  return (<View>...</View>);
}

Когда я открываю этот экран. Я получаю следующие журналы консоли 

 LOG  Initial Amount: 0
 LOG  Rendering
 LOG  DB Amount: 500
 LOG  Initial Amount: 0
 LOG  Rendering
 LOG  Initial Amount: 0
 LOG  Rendering
 LOG  Initial Amount: 0
 LOG  Rendering
 LOG  Initial Amount: 0
 LOG  Rendering
 LOG  Initial Amount: 0
 LOG  Rendering

Как мне остановить использование useState для возврата к значению по умолчанию при повторном рендеринге

1 Ответ

0 голосов
/ 28 марта 2020

Это на самом деле не сбрасывается до начального значения. Вы просто продолжаете вызывать функцию, которая генерирует начальное значение. Вместо того, чтобы вызывать его, передайте его как callback (см. lazy Начальное состояние ) на хук useState(), и он будет вызван один раз: 

const [amount, setAmount] = useState<BigNumber>(getInitialVal); // getInitialVal instead of getInitialVal()
...