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

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

0 голосов
/ 09 июля 2020

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

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

Из прочтения я понимаю, что это что-то добавить в 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)

1 Ответ

0 голосов
/ 09 июля 2020

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

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

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

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

setSubProductDetails(...subProductDetails, final_price: subProduct.final_price)
...