Javascript 物料表：如果my rowdata.status=已取消，如何更改禁用操作按钮

如何基于行数据禁用操作按钮

我正在使用带有远程数据功能的

物料表

当

rowdata.status

被取消时，我必须禁用图标：build

我试图查看文档，但没有帮助。我也试着检查答案，但没有运气

这是我的密码。请帮忙修理一下

提前谢谢

<MaterialTable
  icons={tableIcons}
  tableRef={this.tableRef}
  title="Your Rollouts"
  options={{
    actionsColumnIndex: -1,
    search: true
    // pageSize: 10,
    //  pageSizeOptions: [10, 20, 50]
  }}
  columns={[
    {
      title: "Rollout ID",
      field: "_id"
    },
    { title: "Status", field: "rolloutStatus" },
    { title: "Created By", field: "createdby" },
    { title: "Created Date", field: "CreatedDate", type: "datetime" },
    { title: "Updated Date", field: "updateddate", type: "datetime" },
    { title: "CRQ Number", field: "crqnumber" }
  ]}
  actions={[
    {
      icon: () => <Refresh />,
      tooltip: "Refresh Data",
      isFreeAction: true,
      onClick: () => this.tableRef.current.onQueryChange()
    },

    {
      icon: () => <Build />,
      tooltip: "Perform action",
      onClick: (event, rowData) => {
        this.setState({ visible: true });
      }
    },

    {
      icon: () => <Visibility />,
      tooltip: "View Rollout",
      onClick: (event, rowData) => {
        alert(rowData.xml);
      }
    }
  ]}
  data={query =>
    new Promise((resolve, reject) => {
      let url = "http://localhost:5000/getRollout?";
      if (query.search) {
        url += "querysearch=" + query.search;
        url += "&per_page=" + query.pageSize;
        url += "&page=" + (query.page + 1);
        fetch(url)
          .then(response => response.json())
          .then(result => {
            console.log(result.data);
            resolve({
              data: result.data.filter(pub => pub._id.includes(query.search)),
              page: result.page - 1,
              totalCount: result.total
            });
          });
      } else {
        url += "per_page=" + query.pageSize;
        url += "&page=" + (query.page + 1);
        if (query.orderBy) {
          let sortOrder = query.orderDirection;
          url += "&sort=" + query.orderBy.field + "&sortOrder=" + sortOrder;
        }

        console.log(url);

        fetch(url)
          .then(response => response.json())
          .then(result => {
            console.log(result);
            resolve({
              data: result.data.filter(pub => pub._id.includes(query.search)),
              page: result.page - 1,
              totalCount: result.total
            });
          });
      }

      console.log(url);
      console.log(query.orderBy);
      console.log(query.orderDirection);
    })
  }
/>;

，
工具提示：“刷新数据”，
是的，
onClick:（）=>this.tableRef.current.onQueryChange（）
},
{
图标：（）=>，
工具提示：“执行操作”，
onClick：（事件，行数据）=>{
this.setState（{visible:true}）；
}
},
{
图标：（）=>，
工具提示：“视图卷展栏”，
onClick：（事件，行数据）=>{
警报（rowData.xml）；
}
}
]}
数据={query=>
新承诺（（解决、拒绝）=>{
让url=”http://localhost:5000/getRollout?";
if（query.search）{
url+=“querysearch=”+query.search；
url+=“&per_page=“+query.pageSize；
url+=“&page=“+（query.page+1）；
获取（url）
.then（response=>response.json（））
。然后（结果=>{
console.log（result.data）；
决心({
数据：result.data.filter（pub=>pub.\u id.includes（query.search）），
第页：result.page-1，
totalCount:result.total
});
});
}否则{
url+=“每页=”+query.pageSize；
url+=“&page=“+（query.page+1）；
if（query.orderBy）{
让sortOrder=query.orderDirection；
url+=“&sort=“+query.orderBy.field+”&sortOrder=“+sortOrder；
}
console.log（url）；
获取（url）
.then（response=>response.json（））
。然后（结果=>{
控制台日志（结果）；
决心({
数据：result.data.filter（pub=>pub.\u id.includes（query.search）），
第页：result.page-1，
totalCount:result.total
});
});
}
console.log（url）；
console.log（query.orderBy）；
console.log（query.orderDirection）；
})
}
/>;

它在文档中。您可以在这里查看：条件动作示例

假设要禁用第一个操作，代码如下：

rowData => ({
  disabled: rowData.status === 'canceled',
  icon: () => <Refresh />,
  tooltip: "Refresh Data",
  isFreeAction: true,
  onClick: () => this.tableRef.current.onQueryChange()
})

rowData=>({
已禁用：rowData.status==“已取消”，
图标：（）=>，
工具提示：“刷新数据”，
是的，
onClick:（）=>this.tableRef.current.onQueryChange（）
})

添加如下条件：

         editable={{
              onRowAdd: condition ? (newData => new Promise((resolve) => {
                // add measurement unit action
                addCommercialOperationStatus(newData);
                this.editingPromiseResolve = resolve;
              }).then((result) => {
                if (isString(result)) {
                  // Fetch data
                  getAllCommercialOperationStatus();
                  notification('success', result);
                } else {
                  notification('danger', result);
                }
              })) : null,
              ...

---

嗨，专家们help@Zakhar它起作用了。将示例复制并粘贴到文档中的条件操作上：