Razor 如何使用Blazor子组件中初始化的Web API?

Razor 如何使用Blazor子组件中初始化的Web API?,razor,components,httpclient,blazor,webassembly,Razor,Components,Httpclient,Blazor,Webassembly,我是C#的新手,Blazor一般都是m,已经为此奋斗了很长一段时间 我有一个父组件“parent.razor”和子组件“child.razor” 在parents中,除了所有其他HTML内容外,我还有child标记。所以它看起来像(举个例子) Parent.razor @第页“/机器” 机器信息 @代码 { } 现在,子组件中有一个foreach循环,它迭代列表中的每个项(machinetypes) 如果machinetypes来自指定的静态列表,则所有这些都可以正常工作。 代码如下 Chi

我是C#的新手,Blazor一般都是m,已经为此奋斗了很长一段时间

我有一个父组件“parent.razor”和子组件“child.razor”

在parents中,除了所有其他HTML内容外,我还有child标记。所以它看起来像(举个例子)

Parent.razor
@第页“/机器”
机器信息
@代码
{
}
现在,子组件中有一个foreach循环,它迭代列表中的每个项(machinetypes) 如果machinetypes来自指定的静态列表,则所有这些都可以正常工作。

代码如下

Child.razor
@using Namespace.Shared.Models
@using Blazorise
@inject HttpClient Http


<select>
    @foreach (var machinetype in machinetypes)
    {
        <option value="@machinetype.MachineTypeId">@machinetype.MachineTypeName</option>
    }
</select>

@code {
    public int amachinetypeid { get; set; }

    //This works
    MachineType[] machinetypes = new MachineType[]
    {
        new MachineType{MachineTypeName="TypeX"},
        new MachineType{MachineTypeName="TypeY"}
    };
}
Child.razor
@using Namespace.Shared.Models
@using Blazorise
@inject HttpClient Http


<select>
    @foreach (var machinetype in machinetypes)
    {
        <option value="@machinetype.MachineTypeId">@machinetype.MachineTypeName</option>
    }
</select>

@code {
public int amachinetypeid { get; set; }
public MachineType[] machinetypes;

//This works
//MachineType[] machinetypes = new MachineType[]
//{
//   new MachineType{MachineTypeName="TypeX"},
//    new MachineType{MachineTypeName="TypeY"}
//};

//This does not work    
protected override async Task OnInitializedAsync()
{
    machinetypes = await Http.GetJsonAsync<MachineType[]>("api/machinetype/");
}

}
Child.razor
@使用Namespace.Shared.Models
@使用Blazorise
@注入HttpClient Http
@foreach(machinetype中的var machinetype)
{
@machinetype.MachineTypeName
}
@代码{
public int-amachinetypeid{get;set;}
//这很有效
MachineType[]MachineType=新MachineType[]
{
新的MachineType{MachineTypeName=“TypeX”},
新MachineType{MachineTypeName=“TypeY”}
};
}
但当我尝试使用web API(它也返回列表)时,它不起作用。页面无限期加载,我将遇到错误。代码如下

Child.razor
@using Namespace.Shared.Models
@using Blazorise
@inject HttpClient Http


<select>
    @foreach (var machinetype in machinetypes)
    {
        <option value="@machinetype.MachineTypeId">@machinetype.MachineTypeName</option>
    }
</select>

@code {
    public int amachinetypeid { get; set; }

    //This works
    MachineType[] machinetypes = new MachineType[]
    {
        new MachineType{MachineTypeName="TypeX"},
        new MachineType{MachineTypeName="TypeY"}
    };
}
Child.razor
@using Namespace.Shared.Models
@using Blazorise
@inject HttpClient Http


<select>
    @foreach (var machinetype in machinetypes)
    {
        <option value="@machinetype.MachineTypeId">@machinetype.MachineTypeName</option>
    }
</select>

@code {
public int amachinetypeid { get; set; }
public MachineType[] machinetypes;

//This works
//MachineType[] machinetypes = new MachineType[]
//{
//   new MachineType{MachineTypeName="TypeX"},
//    new MachineType{MachineTypeName="TypeY"}
//};

//This does not work    
protected override async Task OnInitializedAsync()
{
    machinetypes = await Http.GetJsonAsync<MachineType[]>("api/machinetype/");
}

}
Child.razor
@使用Namespace.Shared.Models
@使用Blazorise
@注入HttpClient Http
@foreach(machinetype中的var machinetype)
{
@machinetype.MachineTypeName
}
@代码{
public int-amachinetypeid{get;set;}
公共机器类型[]机器类型;
//这很有效
//MachineType[]MachineType=新MachineType[]
//{
//新的MachineType{MachineTypeName=“TypeX”},
//新MachineType{MachineTypeName=“TypeY”}
//};
//这行不通
受保护的重写异步任务OnInitializedAsync()
{
machinetypes=wait Http.GetJsonAsync(“api/machinetype/”);
}
}
快速检查我的web API,直接访问它会将其返回给我。所以它工作正常。

谁能告诉我哪里做错了?创建依赖注入是必要的吗?如果是的话,有人能给我指一个正确的方向吗


提前感谢您。

您可能有空引用错误。这可能看起来像“无限期加载”

你需要的是

public MachineType[] machinetypes = new MachineType[0];

哦愚蠢的我。现在可以了。谢谢你指出这一点!:)除了答案之外,您可能还需要查看OnParametersSetAsync“事件”,以防数据加载取决于来自父级的参数。如果您使用的是服务器端Blazor,那么使用OnInitialized将被命中两次(因为预渲染),因此您可能希望改用OnAfterRenderAsync。只是前进的提示。嗨@rdmptn。谢谢你的指点。我想我现在也面临类似的问题。现在父组件和子组件都工作了,但我无法将从父组件传递的参数呈现为默认下拉值。。我从名为machinetypeid的父级传递参数。当涉及到子组件时,我能够获得MachineType列表,但即使我能够成功地传递参数,也无法设置默认值。代码:()这是否与您提到的生命周期“事件”有关。什么应该是正确的?Onpatameterssetasync是正确的。在那里停留几天,如果需要,立即致电StateHasChanged。再次感谢你!:)