如何在React中使用提取的数据设置State

Question

我需要使用从redux store获得的对象setState。问题是，当我在组件中调用setState时，我得到的是undefined。关于如何用提取的数据设置状态的默认值，有什么想法吗？

这是我的组件：

import React, { useEffect, Fragment, useState } from 'react';
import { useSelector, useDispatch } from 'react-redux';
const contactDetails = useSelector((state) => state.contactDetails)
const upFields = contactDetails?.contact?.data?.fields

const [contact, setContact] = useState({
fields:  upFields <---- this is returning undefined.. The name is correct, but maybe setState is running too fast? 
})

console.log(contact) <---- this shows {fields: undefined}

console.log(upFields) <---- this console.logs just fine

Answer 1

使用useEffect()并使用对象触发它

useEffect(()=>{
setContact(fetched_data)
}, [fetched_data]) // <-- data array will trigger every time this data change

你可以在使用的第一个组件装载时触发它

useEffect(()=>{
setContact(fetched_data)
}, []) // <-- empty array will only trigger once

Answer 2

因此，我最终将我的状态设置为更高一个组件，并传递"upFields"；到需要此状态的子组件。在子组件中，我只运行了一个useEffect和setState，其中包含我需要的数据