Reactjs 在物料ui选项卡容器中实现状态不工作

我正在尝试在材质ui/tabs组件中实现状态。我可以用函数handleChange来实现它，但我正在努力学习如何实现钩子。useState适用于输入字段，但不适用于材质ui选项卡onChange函数。以下是我的代码：

const [value, setValue] = useState(0)

<Tabs
   value={value}
   onChange={(event) => setValue(event.target.value)}
   variant="scrollable"
   scrollButtons="on"
   indicatorColor="primary"
   textColor="primary"
 >
     <Tab label="All" />
         {subjects.map((subject) => (
             <Tab label={subject.subjectName} />
      ))}
 </Tabs>

const[value，setValue]=useState（0）
setValue（event.target.value）}
variant=“可滚动”
scrollButtons=“on”
指示颜色=“主”
textColor=“主要”
>
{subject.map（（subject）=>(
))}

---

我尝试了使用useffect的控制台日志，它返回

未定义的
onChange
我看到的主要问题是

onChange={(event) => setValue(event.target.value)}

应改为：

onChange={(event, newValue) => setValue(newValue)}

在这种情况下，
事件
只是一个点击事件，
目标
将是点击的特定DOM元素，可以是构成
选项卡的多个元素（例如span、button）中的任意一个。与
输入
元素不同，
选项卡
中的DOM元素都没有
值
属性，因此Material UI将值作为单独的参数传递给
onChange
函数

以下是
选项卡
组件中的相关代码：

  handleChange = event => {
    const { onChange, value, onClick } = this.props;

    if (onChange) {
      onChange(event, value);
    }

    if (onClick) {
      onClick(event);
    }
  };

您可以在
选项卡的文档中找到
onChange
签名：

onChange
func
值更改时触发回调。签名：
函数（事件：对象，值：数字）=>void

下面是一个基于您的代码的工作示例：

谢谢你的帮助！我仍然不明白为什么我们在这个字段中需要newValue，但在输入字段中不需要。你能帮我澄清一下吗？@SujanJoshi我在回答中添加了一些额外的信息。