我使用 bazorise 创建了一个数据网格。我面临的问题是,当用户将查询添加到文本框并按下“开始查询”按钮时,数据将填充到网格视图中。但是,如果用户再次按下相同的按钮以从 db 获取更新的数据,新的列和值将附加到数据网格,同时旧的列和值不会被处理。
注意:如果您想知道清晰查询的工作原理,我们只是重新加载整个页面。它一起删除了数据网格。
数据网格结果.razor:
<Card>
<CardBody>
<Fields>
<Field ColumnSize="ColumnSize.Is12.OnDesktop">
<TextEdit TextChanged="@((string value) => QueryService.SetQueryText(value))" />
</Field>
<Divider />
<Field ColumnSize="ColumnSize.IsAuto.OnDesktop">
<Button Color="Color.Primary" Clicked="@(() => dataGridRef.Reload())">Start Query</Button>
</Field>
</Fields>
<DataGrid @ref="dataGridRef"
TItem="DataRowView"
Data="@queryDataView"
ReadData="@OnReadData"
ShowPager="true" PageSize="@RowCount"
RowStyling="@DataGrid_OnRowStyling"
Filterable="false">
<NextPageButtonTemplate>
Next
</NextPageButtonTemplate>
<LoadingTemplate>
<div class="box">
<progress class="progress is-small is-primary" max="100" />
</div>
</LoadingTemplate>
<DataGridColumns>
@foreach (DataColumn column in QueryTable.Columns)
{
<DataGridColumn TItem="DataRowView" Caption="@column.ColumnName" Field="@nameof(DataRowView.RowVersion)" Context="item" Filterable="false">
<DisplayTemplate>
@($"{item[column.ColumnName]}")
</DisplayTemplate>
</DataGridColumn>
}
</DataGridColumns>
</DataGrid>
</CardBody>
</Card>
数据网格结果.razor.cs
async Task OnReadData(DataGridReadDataEventArgs<DataRowView> e)
{
if (QueryText != "")
{
//dataGridRef = new DataGrid<DataRowView>();
await Task.Run(() => QueryService.StartTable());
queryDataView = QueryTable.DefaultView.Cast<DataRowView>();
displayRefreshField = Display.Always;
StateHasChanged();
}
}