在Blazor中使用多個通用引數和多個父/子組件

我對 Blazor 和基于組件的框架是全新的，并且仍然是 C# 的新手。我正在嘗試制作一個包含多個子組件的表格（這是一個名為“網格”的組件）。每列都是它自己的組件，周圍有頁眉和頁腳組件，稍后將幫助我對每一列進行排序、過濾和求和，類似于 Excel。現在我在我的 Product 類中添加了一些模擬資料，這些資料存盤在_productsList 中，我正在努力用正確的列名和行資料填充這個表。我能夠讓行使用正確的資料在里面<Columns>我不斷收到這個錯誤：The type arguments for method cannot be inferred from the usage但是 Stack Overflow 上的其他示例對于這個錯誤來說太復雜了，我無法跟進。任何建議都會很棒。

這是我index.razor頁面上的內容：

<Grid Data="_products" Label="_columnNames" Options="@gridOptions" GetStyle="@(x => x.Name.EndsWith("1") ? "color: red" : null)">
<Headers>
    @foreach (var i in _columnNames)
    {
        <GridHeader Label="_columnNames[i]" />
    }        
</Headers>
<Columns>
    <GridColumn Value="@context.Id" />
    <GridColumn Value="@context.Name" />
    <GridColumn Value="@context.Weight" />
    <GridColumn Value="@context.Length" />
    <hr />
</Columns>

這是此頁面上的所有引數

GridOptions gridOptions = new() { IsSelectionEnabled = true };
List<Product> _products = Product.InsertProductData().ToList();
List<string> _columnNames = new List<string>{ "ID", "Name", "Weight", "Length" };

這是我的 Grid 組件，名為Grid.razor：

@typeparam T

<div class="mb-3">
    
        <table class="table">
            <thead>
            @if (Label != null)
            {
                @foreach (var item in Label)
                {
                    <tr>
                        @Headers
                    </tr>
                }
            }
            </thead>
            <tbody>
            @if (Data != null)
            {
                @foreach (var model in Data)
                {
                    <tr style="@GetStyle(model)">
                        <th scope="row">
                            @Columns(model)
                        </th>
                    </tr>
                }
            }
            </tbody>
        </table>
</div>

這些是我的 Grid 組件上使用泛型的引數：

[Parameter] public ICollection<T> Data { get; set; }

[Parameter] public ICollection<T> Label { get; set; }

[Parameter] public GridOptions Options { get; set; }

[Parameter] public RenderFragment Footer { get; set; }

[Parameter] public RenderFragment<T> Columns { get; set; }

[Parameter] public RenderFragment Headers { get; set; }

[Parameter] public Func<T, string> GetStyle { get; set; }

我認為問題出在HeadersRenderFragment 上，因為在我添加此代碼之前它可以作業，但現在即使我注釋掉它也無法正常作業，所以我很困惑

uj5u.com熱心網友回復：

該錯誤是因為您需要為組件指定引數型別

<Grid Data="_products" T="Product" ...

但是我在這里看到你的代碼中有很多錯誤我做了一個類似的作業示例......

<Grid Data="_products" T="Product" Label="_columnNames" H="string" GetStyle="@(x => x.Name.EndsWith("1") ? "color: red" : null)">
    <Headers>
        <div>@context</div>
    </Headers>
    <Columns>
        <td>@context.Id</td>
        <td>@context.Name</td>
        <td>@context.Weight</td>
        <td>@context.Length</td>
        <hr />
    </Columns>
</Grid>

@code
{
    record Product(int Id, string Name, int Weight, int Length);
    List<Product> _products = new()
    {
        new Product(1, "San", 80, 177),
        new Product(2, "Luli", 64, 168)
    };
    List<string> _columnNames = new List<string>{ "ID", "Name", "Weight", "Length" };

}

和網格...

@typeparam T
@typeparam H

<div class="mb-3">
    <table class="table">
        <thead>
        @if (Label != null)
        {
            <tr>
            @foreach (var item in Label)
            {
                <th>
                    @Headers(item)
                </th>
            }
            </tr>
        }
        </thead>
        <tbody>
        @if (Data != null)
        {
            @foreach (var model in Data)
            {
                <tr style="@GetStyle(model)">
                        @Columns(model)
                </tr>
            }
        }
        </tbody>
    </table>
</div>

@code
{
    [Parameter] public ICollection<T> Data { get; set; }

    [Parameter] public ICollection<H> Label { get; set; }

    [Parameter] public RenderFragment Footer { get; set; }

    [Parameter] public RenderFragment<T> Columns { get; set; }

    [Parameter] public RenderFragment<H> Headers { get; set; }

    [Parameter] public Func<T, string> GetStyle { get; set; }

}

標籤：C＃ 。网 仿制药 成分 西装外套

上一篇：游戲物件找不到它的父物件

下一篇：從選定物件獲取資料