时间戳

首页 > 解决方案 > 基于反应材料表中的行数据的行动作

reactjs - 基于反应材料表中的行数据的行动作

问题描述

我只需要在某些行（具有特定属性值）中进行行操作。例如，如果我有一个属性“isDeletable”设置为 true 的行，我希望能够删除它，即在操作列中存在一个删除图标。

提前致谢！

标签： reactjsmaterial-uimaterial-table

解决方案

在组件的动作定义中MaterialTable，您可以访问rowData可用于有条件地计算每个动作的disabled或hidden道具的参数。检查以下示例，其中仅在status ==='active'.

<MaterialTable
// ..other props
actions={[
          (rowData) => {
            return {
              icon: "bug_report",
              tooltip: "Report bug",
              disabled: rowData.status === "active",
              // hidden: rowData.status === "active",
              onClick: (event, rowData) =>
                alert("This client status is " + rowData.status)
            };
          }
        ]}
/>

这是一个带有工作示例的沙箱。

让我知道这是否对您有用！

推荐阅读