经历了一些问答；这似乎与Tabbed表单和验证非常匹配。我的问题。然而，这并不能解决我的问题。
我使用的是react material ui表单验证器，如果您在ValidatorForm中有多个输入，并尝试提交，它会显示错误，如果有任何错误，则不允许提交表单。
然后，我将输入分为两部分，并使用ValidatorForm中的Material UI选项卡现在提交时，它只显示打开的选项卡上的错误，而不显示隐藏的选项卡上。。一种检查方法是，如果某些表单数据是必需的，我可以在提交时检查状态，并执行诸如"不提交"之类的操作，并用感叹号图标更新选项卡的标签。但是，这不会显示错误字段。
但是，我正在寻找一种可以让它变得简单而无需对提交处理程序进行更多检查的方法，相反，验证器可以像处理一页表单一样进行操作。
这是CodeSandbox链接供您参考。如果您有任何解决方案，请在代码中进行更改。
Ciao，从技术上讲，不可能验证Tab中不是当前所选Tab的TextValidator(因为该Tab上的元素未加载到DOM上(。
但是
我们可以做点什么。基本上，每次ValidatorForm验证表单中的元素时，都会调用submit()函数。因此，我们的想法是：每次更改Tab时，我们都可以调用这个submit()来验证Tab上的元素
因此，首先，为表单创建一个引用：
<ValidatorForm
ref={(ref) => { this.form = ref; }}
...
然后，在Tab更改时，我们可以这样调用this.form.submit()：
handleTabChange = (event, newValue) => {
this.setState({ value: newValue });
this.form.submit();
};
到目前为止还不错。我试过了，但它不起作用：(更好的是，它起作用，但前提是你在同一个Tab上点击两次。为什么？因为Tab有一个延迟加载。所以要删除这个延迟加载，我们必须删除TabPanel返回函数上的条件value === index。然后我删除了，现在它起作用：(
但我们可以做得更好。只要没有点击提交按钮，表单就不应该被验证。因此，我们可以在状态中添加一个额外的布尔值(默认false(，当用户单击提交按钮时，我们将该布尔值设置为true：
<Button
onClick={() => {
this.form.submit();
this.setState({ submitted: true });
}}
>
Submit
</Button>
并且我们为handleTabChange函数添加了一个条件：
handleTabChange = (event, newValue) => {
this.setState({ value: newValue });
if (this.state.submitted) this.form.submit();
};
所以，直到按钮并没有被按下，表单仍然并没有被验证。如果用户单击按钮，表单将被验证，并且每次用户更改Tab时，如果包含无效值，TextValidators将显示错误。
这里修改了你的代码沙盒。