如何为Blazor QuickGrid添加以复选框形式展示的布尔列？

当然可以给Blazor QuickGrid的布尔列设置为复选框形式展示，核心是利用QuickGrid的TemplateColumn来自定义列内容，替代默认的绑定列。以下是具体实现方案：

1. 只读复选框（仅展示状态） #

如果只需要展示布尔值状态，不需要用户修改，直接添加禁用的复选框即可：

<QuickGrid Items="@yourDataList">
    <!-- 其他业务列 -->
    <TemplateColumn Title="是否启用">
        <input type="checkbox" checked="@context.IsEnabled" disabled />
    </TemplateColumn>
</QuickGrid>

其中@context指代当前行的数据对象，IsEnabled是你数据模型中的布尔类型属性，disabled属性确保复选框仅作展示用。

2. 可交互复选框（支持修改值） #

如果需要用户直接点击复选框修改数据，去掉disabled属性并绑定值即可：

<QuickGrid Items="@yourDataList">
    <!-- 其他业务列 -->
    <TemplateColumn Title="是否启用">
        <input type="checkbox" @bind="@context.IsEnabled" />
    </TemplateColumn>
</QuickGrid>

用户点击复选框时，会直接同步更新对应数据对象的布尔属性值。

3. 样式优化（可选） #

如果需要让复选框样式贴合项目UI，可添加自定义CSS类：

<QuickGrid Items="@yourDataList">
    <!-- 其他业务列 -->
    <TemplateColumn Title="是否启用">
        <input type="checkbox" @bind="@context.IsEnabled" class="grid-checkbox" />
    </TemplateColumn>
</QuickGrid>

之后在样式文件中定义.grid-checkbox的样式即可。

补充：QuickGrid的默认PropertyColumn仅会输出布尔值的字符串形式（True/False），而TemplateColumn是实现自定义列内容的核心方式，官方虽无专门的布尔复选框示例，但通过模板列可轻松实现这类自定义展示需求。

内容的提问来源于stack exchange，提问作者curious