Question

我希望有人能提出建议，让我找出潜在的问题所在。我认为是序列化/反序列化，而不是网格。

我正在尝试使用Syncfusion Blazor网格组件呈现从ASP.NET Web Api返回的数据。 JliffDocument来自open source library。也许对象是由复合类型构成的事实是一个促成因素，但是我可以在单元测试中成功地序列化和反序列化对象图。例如。 TextElement实现一个接口，Segment存储该接口的集合。

这有效（但jlfDoc是本地创建的数据）

<EjsGrid id="Grid" DataSource="@jlfDoc.Segments" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })" AllowPaging="true">
    <GridPageSettings PageSize="5"></GridPageSettings>
    <GridEditSettings AllowAdding="true" AllowDeleting="true" AllowEditing="true"></GridEditSettings>
    <GridColumns>
        <GridColumn Field="SourceText" HeaderText="Source"  IsPrimaryKey="true" TextAlign="@Syncfusion.EJ2.RazorComponents.Grids.TextAlign.Right" Width="120"></GridColumn>
        <GridColumn Field="TargetText" HeaderText="Target" Width="150"></GridColumn>
    </GridColumns>
</EjsGrid>

<hr/>
<p>@rawContent</p>

<h1>There are @segments Segments</h1>

<i>@oneTextString</i>


@functions {
    public object gridData { get; set; }
    public JliffDocument jlfDoc { get; set; }
    public string rawContent { get; set; }
    public int segments { get; set; }
    public string oneTextString { get; set; }
    protected override async Task OnInitAsync()
    {
        jlfDoc = new JliffDocument("en-US",
            "it-IT",
            new File("f1",
                new Unit("u1",
                    new Segment(
                        new TextElement("Hello"),
                        new TextElement("Ciao")),
                    new Segment(
                        new TextElement("Goodnight"),
                        new TextElement("Buonanotte")))));
    }
}

这也可以部分工作（{{1}行{{1}，rawContent和segments变量 DO }}被注释掉，oneTextString被删除，这表明Api调用和jd的反序列化成功。

jlfDoc = jd;

这两行更改失败

DataSource="@jlfDoc.Segments"

浏览器工具控制台中的错误是：

<EjsGrid id="Grid" DataSource="@gridData" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })" AllowPaging="true">
    <GridPageSettings PageSize="5"></GridPageSettings>
    <GridEditSettings AllowAdding="true" AllowDeleting="true" AllowEditing="true"></GridEditSettings>
    <GridColumns>
        <GridColumn Field="SourceText" HeaderText="Source"  IsPrimaryKey="true" TextAlign="@Syncfusion.EJ2.RazorComponents.Grids.TextAlign.Right" Width="120"></GridColumn>
        <GridColumn Field="TargetText" HeaderText="Target" Width="150"></GridColumn>
    </GridColumns>
</EjsGrid>

<hr/>
<p>@rawContent</p>

<h1>There are @segments Segments</h1>

<i>@oneTextString</i>


@functions {
    public object gridData { get; set; }
    public JliffDocument jlfDoc { get; set; }
    public string rawContent { get; set; }
    public int segments { get; set; }
    public string oneTextString { get; set; }
    protected override async Task OnInitAsync()
    {
        string serverDoc = String.Empty;

        using (HttpClient client = new HttpClient())
        {
            serverDoc = await client.GetStringAsync("https://localhost:44381/api/document");
        }

        rawContent = serverDoc;

        JliffDocument jd;
        JSON.MakeInto(JSON.Load(serverDoc), out jd);
        segments = jd.Segments.Count;
        oneTextString = jd.Segments[0].TargetText;
        //jlfDoc = jd;
    }
}

Answer 1

我们怀疑您正在尝试使用未初始化对象的引用（“ jlfDoc”可能为空）。因此，我们建议您添加条件以检查对象是否为空，然后再访问其属性以解决此问题，如@HenkHolterman在评论部分中所述。

Answer 2

如果您忘记在要从组件外部访问的组件属性上使用[Parameter]属性，则可能会收到“ 当前没有与该组件关联的元素”错误。

从Web Api返回的Blazor问题呈现数据

2 个答案: