16

如何将参数传递给剃须刀组件？

到目前为止我试过

@(await Html.RenderComponentAsync<Rateplan>(RenderMode.ServerPrerendered, new { id= 100}))

但我收到一个错误

InvalidOperationException：不支持使用参数预呈现服务器组件。

我用 RenderMode.ServerPrerendered 尝试同样的事情，但我收到一个错误

InvalidOperationException：不支持带参数的服务器组件。

我也试过做

<Rateplan Id="100"></Rateplan>

但这甚至没有启动组件。

4

3 回答 3

21

在要接受参数的组件中，您需要将属性标记为参数

喜欢

[Parameter]
public List<Player> Players { get; set; }

然后你应该能够将参数传递为

<Componentname Players="@players"></Componentname>

（在这个例子中，@players 是一个局部变量）

于 2019-09-25T11:33:17.493 回答
3

将 RenderMode 设置为静态

@(await Html.RenderComponentAsync<Rateplan>(RenderMode.Static, new { id = 100 }))
于 2019-09-25T17:46:54.703 回答
2

本文描述了该问题和解决方法。（有一个小错误，因为GetModel应该命名GetCustomerId）不支持传递参数，正如异常所说。

你可以等待 ASP.NET Core 3.1，在那里将恢复传递参数的能力。

我已经为像这样的参数实现了第一篇文章中的解决方案OperationId- 剃须刀组件的代码：

using Microsoft.JSInterop;

[Inject]
protected IJSRuntime jrt { get; set; }

protected async override Task OnAfterRenderAsync(bool firstRender)
{
    if (firstRender)
    {
        try
        {
            var oid = await jrt.InvokeAsync<string>("GetOperationId");
            int opid;
            if (int.TryParse(oid, out opid))
                OperationId = opid;
        }
        catch (Exception ex)
        {
            ls?.LogException(ex, "Sortiment.OnAfterRenderAsync");
        }
        //This code was moved from OnInitializedAsync which executes without parameter value
        if (OperationId.HasValue)
            sortiment = await ProductService.GetSortimentAsync(null, OperationId, Odpady);
        else
            productFilter = await ProductService.GetProductFilterAsync();
        StateHasChanged(); //Necessary, because the StateHasChanged does not fire automatically here
    }
}

并将其添加到托管 Razor 页面：

@section Header
{
  <script>
  function GetOperationId() {
    return "@Model.OperationId";
  }
  </script>
}

此解决方法仅适用于RenderMode.Server.

于 2019-11-14T09:07:46.800 回答