Question

我有一个简单的React应用程序，它调用一个ASP.NET MVC控制器，它返回一个简单的对象（见下文）。我的问题是我无法写出值，因为它未定义。

我制作了以下React接口，它与返回的数据相同：

interface CreditData {
    Description: string;
    RatingData: {
        SummaryRating: number;
        Equity: number;
        Age: number;
        Employees: number;
        Type: number;
        Situation: number;
    };
    CompanyData: {
        VAT: string;
        Name: string;
        Address: string;
        Zipcode: string;
        City: string;
        Phone: string;
        Email: string;
        Startdate: string;
        Enddate: string;
        Employees: string;
    }

}

React类使用的接口是：

interface CompanySearchState {
    loading: boolean;
    query: string;
    creditData: CreditData | null;
    showresult: boolean;
}

我有一个按钮，当我单击按钮时，会运行以下代码：

searchVat() {
    this.setState({ loading: true });

    var url = 'api/CreditData/creditrating?query=' + this.state.query;

    fetch(url)
        .then(response => response.json() as Promise<CreditData>)
        .then(data => {
            console.log(data);
            this.setState({ creditData: data, loading: false, showresult: true });
        });
}

现在，我没有在通话中收到任何错误。但是，在我的布局中我遇到了问题。我有以下观点：

return <div><h1>Resultat for {this.state.creditData!.CompanyData!.Name}</h1>
                <div className='row'>
                    <div className='col-md-6'>
                        <h3>Rating</h3>
                        Fra 1-10: {this.state.creditData!.RatingData!.SummaryRating}
                        <h3>Data</h3>
                        {this.state.creditData!.Description}
                    </div>
                    <div className='col-md-6'>
                        <p>Test</p>
                    </div>

                </div>
            </div>

我的挑战如下：this.state是正确无误的。当我将它悬停在调试模式时，我甚至可以看到我想要的值：

但在我看来，companyData对象是＆＃34;未定义＆＃34;，尽管它在之前的图像中起作用：

现在，我能看到的唯一区别是，一个是CompanyData，另一个是companyData。但这对我没有帮助，因为如果我在界面内写了一个小companyData，我会收到另一个错误。

所以我的问题是：我想访问companyData对象，但它未定义。我不明白这一点，因为当我将鼠标悬停在this.state时，它在调试器中运行得非常好。

我的C＃viewmodel返回：

public class CreditData
{
    public int Rating { get; set; }
    public string Description { get; set; }
    public CompanyData CompanyData { get; set; }
    public Rating RatingData { get; set; }
}

public class Rating
{
    public int SummaryRating { get; set; }
    public decimal Equity { get; set; }
    public decimal Age { get; set; }
    public decimal Employees { get; set; }
    public decimal Type { get; set; }
    public decimal Situation { get; set; }

}

public class CompanyData
{
    public string VAT { get; set; }
    public string Name { get; set; }
    public string Address { get; set; }
    public string Zipcode { get; set; }
    public string City { get; set; }

    public string Phone { get; set; }
    public string Email { get; set; }

    public string Startdate { get; set; }
    public string Enddate { get; set; }
    public string Employees { get; set; }

    public bool @protected { get; set; }
    public string Fax { get; set; }
    public string Addressco { get; set; }
    public int Industrycode { get; set; }
    public string Industrydesc { get; set; }
    public int Companycode { get; set; }
    public string Companydesc { get; set; }
    public string Creditstartdate { get; set; }
    public int? Creditstatus { get; set; }
    public bool Creditbankrupt { get; set; }
    public ApiOwners[] Owners { get; set; }
    public ApipPoductionunits[] Productionunits { get; set; }
    public int T { get; set; }
    public int Version { get; set; }
}

React接口：Promise有效但对象仍未定义＆＃34;未定义＆＃34;

0 个答案: