ant-design-blazor/site/AntDesign.Docs/Demos/Components/Table/demo/CustomRowStyle.razor
2021-02-06 20:15:46 +08:00

58 lines
1.2 KiB
C#

@using System.ComponentModel
@using AntDesign.TableModels
<Table TItem="Data" DataSource="@data" OnRowClick="OnRowClick" RowClassName="@(x => x.Data.RowClass)">
<Column @bind-Field="@context.Name">
<a>@context.Name</a>
</Column>
<Column @bind-Field="@context.Score"></Column>
</Table>
<style>
.danger {
background-color: #fff1f0;
}
</style>
@code{
Data[] data = new Data[]
{
new()
{
Key = "1",
Name = "John Brown",
Score = 95,
},
new()
{
Key = "2",
Name = "Jim Green",
Score = 87,
},
new()
{
Key = "3",
Name = "Joe Black",
Score = 65,
}
};
public class Data
{
[DisplayName("Key")]
public string Key { get; set; }
[DisplayName("Name")]
public string Name { get; set; }
[DisplayName("Score")]
public int Score { get; set; }
public string RowClass => Score < 70 ? "danger" : "";
}
void OnRowClick(RowData<Data> row)
{
Console.WriteLine($"row {row.Data.Key} was clicked");
}
}