如何在react中使material UI选项卡组件可自动滚动

npm install @material-ui/core

import React from 'react';
import { Tabs, Tab, makeStyles } from '@material-ui/core';

const useStyles = makeStyles((theme) => ({
  root: {
    flexGrow: 1,
    backgroundColor: theme.palette.background.paper,
    overflowX: 'auto',
    whiteSpace: 'nowrap',
  },
}));

const MyComponent = () => {
  const classes = useStyles();

  return (
    <div className={classes.root}>
      <Tabs
        value={0} // 设置默认选中的选项卡索引
        indicatorColor="primary"
        textColor="primary"
        variant="scrollable"
        scrollButtons="auto"
      >
        <Tab label="选项卡1" />
        <Tab label="选项卡2" />
        <Tab label="选项卡3" />
        {/* 添加更多选项卡 */}
      </Tabs>
    </div>
  );
};