Только сначала отправить в Firebase, не работает

Question

Я создал эти входные данные, из которых я хочу, чтобы мои данные были сохранены в firebase.

Проблема в том, что каждый ТОЛЬКО ПЕРВЫЙ отправляющий, не работает, каждый отправляющий после, работает просто отлично.

Может кто-нибудь помочь мне выяснить, в чем проблема?

export default function TransactionScreen() {
  const [account, setAccount] = useState("");
  const [amount, setAmount] = useState("");

  const handleTransaction = async e => {
    await firebase
      .firestore()
      .collection(`Transaction`)
      .add({
        account,
        amount,
        createdAt: firebase.firestore.FieldValue.serverTimestamp(),
        deletedAt: null,
        updatedAt: null
      });
  };
  return (
    <Card width bold>
      New Transaction
      <form onSubmit={handleTransaction} className="Transaction-form">
        <div className="Transaction-form__input">
          Transfer to:
          <Input
            width
            placeholder="Transfer to"
            onChange={setAccount}
            value={account}
            type="number"
          />
        </div>
        <div className="Transaction-form__input">
          Amount:
          <Input
            width
            placeholder="Amount"
            onChange={setAmount}
            value={amount}
            type="number"
          />
        </div>
        <div className="Transaction-form__btn">
          <Button bordered>Send Transaction</Button>
        </div>
      </form>
    </Card>
  );
}

Answer 1

Я отвечаю на свой вопрос!

Я выяснил, где проблема,

Я не использовал e.prevenDefault (); после

const handleTransaction = asyn c e => {

, поэтому правильный путь:

const handleTransaction = async e => { e.preventDefault(); await firebase .firestore() .collection( Транзакция ) .add({ account, amount, createdAt: firebase.firestore.FieldValue.serverTimestamp(), deletedAt: null, updatedAt: null }) .then(setAccount(""), setAmount("")); };