Пустой реквизит отправлен дочернему компоненту и не обновлен?

Я использую React и API для извлечения данных и предварительного заполнения их для формирования полей, чтобы пользователь мог редактировать существующую запись.

Однако дочерний компонент, похоже, получает только версию сущности longhorn, созданную в начале, а не ту, что была получена API, и также не обновляется.

Соответствующий код родительской страницы:

React.useEffect(() => {
        async function getLonghorn() {
            let response = await fetch(`http://127.0.0.1:8081/longhorns/${longhornID}`, { method: 'get' })
            let data = await response.json();
            setLonghorn(await data[0]);
        };

        if (longhorn.Name === "") {
            getLonghorn();
        }

    }, [longhorn.Name, longhornID]);

    return (
        <>
            <Navbar />
            <AdminImageUploadUI type = "longhorn" id = {longhornID} imageList = {imageList}></AdminImageUploadUI>
            <AdminEditLonghornForm {...longhorn} ></AdminEditLonghornForm>
        </>
    )

Соответствующий код дочернего компонента:

import React from 'react'
import { render } from 'react-dom';
import GetRequest from '../../Get';

type props = {
    LonghornID: number, 
    Name: string, 
    RanchPrefix: string, 
    RoleID: number, 
    SexID: number, 
    IsExternal:number, 
    FatherLonghornID:number, 
    MotherLonghornID: number, 
    ReferenceNumber: string, 
    DOB: string, 
    Description:string};

class AdminEditLonghornForm extends React.Component<{}, {
    LonghornID: number, 
    Name: string, 
    RanchPrefix: string, 
    RoleID: number, 
    SexID: number, 
    IsExternal:number, 
    FatherLonghornID:number, 
    MotherLonghornID: number, 
    ReferenceNumber: string, 
    DOB: string, 
    Description:string,
    message: string}> 
    {

    constructor(props: props) {
        super(props)

        this.state = {
            LonghornID: props.LonghornID,
            Name: props.Name,
            RanchPrefix: props.RanchPrefix,
            RoleID: props.RoleID,
            SexID: props.SexID,
            IsExternal: props.IsExternal,
            FatherLonghornID: props.FatherLonghornID,
            MotherLonghornID: props.MotherLonghornID,
            ReferenceNumber: props.ReferenceNumber,
            DOB: props.DOB,
            Description: props.Description,
            message: ''
        }
    }

Если я запускаю console.info объект longhorn в родительском объекте, он дублирует журналы несколько раз, показывая пустой набор данных по умолчанию в первых трех или около того, а затем показывая заполненные данные в последних нескольких журналах. Регистрация полученных реквизитов в дочернем элементе каждый раз показывает пустые данные. Я попытался создать новый объект и разрушить его в списке отправленных реквизитов, но он стал жертвой тех же исходных данных, показывающих проблемы.

Я подозреваю, что это неправильное использование React.UseEffect, но мне приходилось полагаться на это, чтобы моя функция асинхронной выборки работала правильно. Извините, если мой код и структура немного беспорядочны, все еще новичок в JavaScript