TabbedForm - 在 FormTab 上有条件地显示工具栏（提交按钮）

Question

使用 TabbedForm 时，有没有办法有条件地删除特定选项卡中的提交按钮（工具栏）？ （反应管理）

Answer 1

这是我使用自定义工具栏的方法：

<TabbedForm toolbar={<PostEditToolbar {...props} />}>...

工具栏看起来像这样：

const PostEditToolbar = props => {
  const { hasList, hasEdit, hasShow, hasCreate, redirect, ...rest } = props
  return (
    <Toolbar {...props}>
      <Route exact path={'/Posts/:id/:tab_index'} render={props => ''} />
      <Route
        exact
        path={'/Posts/:id'}
        render={props => (
          <SaveButton redirect={`/Posts/${rest.id}`} {...rest} />
        )}
      />
    </Toolbar>
  )
}

为此，您需要

import { Route } from 'react-router-dom'

，并根据需要调整路线路径。

Answer 2

恐怕这是不可能的，除非您创建自己的

TabbedForm

组件

Answer 3

您可以在选项卡上使用 onClick 并基于此管理状态，如下所示

const [currentTab, setCurrentTab] = useState("Comments");

const handleTabClick = (tabLabel) => {
  setCurrentTab(tabLabel);
};

const toolbar = (
  <div>
    {(currentTab != "Comments") ? (
        <SaveButton />
    ) : null }
  </div>
);

<TabbedForm.Tab
  label="Comments"
  onClick={() => handleTabClick("Comments")}
></TabbedForm.Tab>