Перехватчики реакции useState отправляют второй раз из дочернего компонента

У меня есть система управления заказами - Order.js page with Child Component ProductsForm.js

  • При заполнении формы для добавления продукта к заказу я использую onChange для обновления useState подробными сведениями.
  • Когда нажимаю "Отправить" - если цена не указана, я обновляю цену в информации о продукте и отправляю
  • 1-я отправка - отправляет почтовый запрос без цены
  • 2-й щелчок по отправке - отправка почтового запроса с правильной ценой

Из прочтения я понял, что это что-то добавить в useState или преобразовать в useEffect? Могу ли я использовать несколько эффектов?

Как я могу решить эту проблему? - Спасибо!

const submitOrderProduct = () => {

        if (subProductDetails.final_price === '')
            console.log('PRICE Not Set, Update Price from Product Info..')
            setSubProductDetails(subProductDetails => ({...subProductDetails,
                final_price: selectedItemDetails.final_price}))

     >>>>>>>>>>>>   HERE Need to Refresh / Callback Something  <<<<<<<<<<<<<

        const subProduct = {
            order: subProductDetails.order,
            product: subProductDetails.product,
            sub_product: subProductDetails.sub_product,
            units_to_buy: parseInt(subProductDetails.sub_units_to_buy),
            final_price: parseFloat(subProductDetails.final_price),
            unit_cost_before_fees: parseFloat(subProductDetails.unit_cost_before_fees),
            discount: parseInt(subProductDetails.sub_discount),
            notes: subProductDetails.sub_notes,
        }

        axios.post('http://127.0.0.1:8000/api/orderProducts/', subProduct)

reactjs react-hooks use-state
person Eliran Nider    schedule 09.07.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вам нужно установить состояние до отправки запроса на публикацию?

Решит ли приведенное ниже выражение вашу проблему?

final_price: subProductDetails.final_price !== ""
             ? parseFloat(subProductDetails.final_price)
             : selectedItemDetails.final_price

Затем вы можете установить состояние

setSubProductDetails(...subProductDetails, final_price: subProduct.final_price)
person Hyetigran    schedule 09.07.2020
comment
Да, это определенно способ сделать это - спасибо! - person Eliran Nider; 09.07.2020