reactjs - 未捕获的 TypeError：formData 不可迭代

Question

我正在尝试使用钩子从不同的子组件收集和创建一个对象。

有多个子组件将更新父组件中的状态并创建一个主对象以将其发送到 API。

// creating a hook

const [formData, setFormData] = useState({});


// Getting data from the child and setting it using a hook set method

const deliveryContactDetails = deliveryData => {  
    contacts.push(deliveryData);
};

const productNameData = productData => {
    setFormData(...formData, productData);
}

const onboardDetailsData = detailsData => {
    setFormData(...formData, detailsData)
}


// Using ref to call the child and send data to parent

 useImperativeHandle(ref,() => ({
    sendData() {
        productRef.current.sendData()
        detailsRef.current.sendData()
        deliveryRef.current.map(
          ref => ref.current.sendData()
        );
        setFormData(...formData, { contacts: contactArray });
        props.saveItem(tempObj);
    }
  }));

在控制台中获取错误

corporateOnboardingDetails.js:137 未捕获类型错误：formData 在 Object.productNameData [as saveProduct] 处不可迭代（corporateOnboardingDetails.js:137）

标签： reactjsreact-hooks

Answer 1

您试图将对象作为参数传播给函数调用。您需要将对象传递给setFormData函数（您忘记了括号{}）。

const productNameData = productData => {
    setFormData({...formData, productData});
}

const onboardDetailsData = detailsData => {
    setFormData({...formData, detailsData});
}