Javascript ReactJS和material ui未在移动设备上呈现页面的全宽

我正试图找出这个问题的原因。没有进一步的描述，我宁愿附上一些截图，这样你可以看到问题。第一个屏幕是桌面视图和第二个移动视图，因此您可以比较这两个屏幕

这是上面菜单的源代码，也许你会看到是什么导致了这个问题

import React，{useState，useffect}来自“React”；
从“道具类型”导入道具类型；
从'@material ui/core/styles'导入{makeStyles，ThemeProvider}；
从“@material ui/core/AppBar”导入AppBar；
从“@material ui/core/Tabs”导入选项卡；
从“@material ui/core/Tab”导入选项卡；
从“@material ui/core/Typography”导入排版；
从“@material ui/core/Box”导入框；
从“@material ui/core/TextField”导入TextField；
从“react router dom”导入{Link}；
从'@material ui/core/styles'导入{createMuiTheme}；
从“react router dom”导入{useLocation}
从“@material ui/icons/Home”导入HomeIcon
从“@material ui/icons/MenuBook”导入MenuBookIcon
从“@material ui/icons/People”导入人物图标
const theme=createMuiTheme({
调色板：{
主要：{
灯光：“#5472d3”，
main:“#0d47a1”，
深色：“#002171”，
对比文本：“#fff”，
},
中学：{
灯光：“#efefef”，
主要内容：“#bdbdbd”，
深色：“#8d8d8d”，
对比文本：“#000”，
},
},
});
功能选项卡面板（道具）{
const{children，value，index，…other}=props；
返回(
{value===索引&&(
{儿童}
)}
);
}
TabPanel.propTypes={
子项：PropTypes.node，
索引：PropTypes.any.isRequired，
值：PropTypes.any.isRequired，
};
功能a11yProps（索引）{
返回{
id:`simple tab-${index}`，
“aria控件”：“简单选项卡面板-${index}”，
};
}
const useStyles=makeStyles（（主题）=>({
根目录：{
flexGrow:1，
背景色：theme.palete.background.paper
}
}));
导出默认功能菜单（道具）{
const classes=useStyles（）；
const[value，setValue]=React.useState（0）；
const location=useLocation（）；
//const currentLocation=location.pathname；
常量handleChange=（事件，newValue）=>{
设置值（新值）；
};
返回(
);
}