Typescript React State未从prop中初始化

我正在与react 和打字.我是新手，我不确定如何确保子组件根据传递给它的props 正确地设置状态.

我正在将一个对象从父组件传递给子组件作为props .父组件具有一个具有关键点和空值的对象.下面是一个这样的例子:

emptyObject = {
    id: '',
    name: '',
    timestamp: ''
}

异步功能foo查询数据库并基于组件的属性填充值，然后返回更新的对象的promise .然后，应该将更新后的对象传递给子组件，在该子组件中，值存储为State.

function ParentComponent({propName}) {
    const [myObject, setMyObject] = useState(emptyObject);

    useEffect( () => {
        foo(emptyObject).then((x) => {
            setMyObject(x);
        });
    }, [propName]);

    return (
        <>
            <ChildComponent obj = {myObject} />
        </>
    );
}


function ChildComponent({obj}) {
    const {id, name, timestamp} = obj;
    console.log("id: " + id + ". name: " + name) // this gives the correct values
    
    const [myId, setMyId] = useState(id)
    const [myName, setMyName] = useState(name);
    console.log("id: " + myId + ". name: " + myName) // this gives "id: undefined. name: undefined"


    return (
        <displays a form that is pre-populated with the id and name values>
    )
}

我面临的问题是，解构对象会给出正确的值，但State中的值是未定义的.我怀疑这是因为在Reaction中设置State是异步的，但我不确定如何解决这个问题.

我try 的第一件事是在子组件中添加一个挂钩，但同样的问题也出现了.

function ChildComponent({obj}) {
    const {id, name, timestamp} = obj;
    const [myId, setMyId] = useState(id)
    const [myName, setMyName] = useState(name);
    
    useEffect( () => {
        setMyId(id);
        setMyName(name);
    }, [obj]);

我还try 在父级中实现两个useEffects，并修改原始useEffect中的逻辑，以确保值更新，但仍然会出现相同的结果.

const [myObject, setMyObject] = useState(emptyObject);
const [updatedObject, setUpdatedObject] = useState(emptyObject);

    useEffect( () => {
       foo(emptyObject).then((x) => {
           setUpdatedObject(x);
       });
    }, [propName]);

    useEffect( () => {
        setMyObject(updatedObject);
    }, [updatedObject]);

    return (
        <>
            <ChildComponent obj = {myObject} />
        </>
    );