Javascript 将类转换为hooks'；道具'；未定义无未定义` 我正在尝试将类组件转换为函数组件 所以我按照下面的文章进行了部分转换 但不知道如何转换道具 我面临一个错误 /src/components/SportsExpansion.js 第65行：“道具”未定义无未定义 你能告诉我如何修复它吗？我是否需要对它进行任何其他更改

类组件代码

import React，{Fragment，useState，Component}来自'React'；
从“./styles”导入样式；
从“@material ui/core/styles”导入{withStyles}”；
从“类名称”导入类名称；
从“@material ui/icons/ExpandMore”导入ExpandMoreIcon；
从“@material ui/core/IconButton”导入IconButton；
从“@material ui/core/Button”导入按钮；
从“@material ui/core/ExpansionPanel”导入ExpansionPanel；
从“@material ui/core/ExpansionPanelSummary”导入ExpansionPanelSummary；
从“@material ui/core/ExpansionPanelDetails”导入ExpansionPanelDetails；
从“@material ui/core/Typography”导入排版；
从“@material ui/core/Drawer”导入抽屉；
从“@material ui/core/AppBar”导入AppBar；
从“@material ui/core/Tabs”导入选项卡；
从“@material ui/core/Tab”导入选项卡；
从'@fortawesome/react fontawesome'导入{FontAwesomeIcon}；
从“@material ui/core/Radio”导入无线电；
从“@material ui/core/RadioGroup”导入射线组；
从“@material ui/core/FormControlLabel”导入FormControlLabel；
从“@material ui/core/FormControl”导入FormControl；
从“@material ui/core/FormLabel”导入FormLabel；
从“@material ui/core/Checkbox”导入复选框；
从'@material ui/core/styles'导入{MuiThemeProvider，createMuiTheme}；
从“../../../../styles.css”导入数据样式；
功能选项卡容器（道具）{
返回(
{props.children}
);
}
常数radioValues=[
{
标签：“选择此类别的所有提供程序”，
值：“PRO”，
},
];
类扩展扩展扩展组件{
状态={
值：0，
spHeight:[]，
脾脏：''，
};
componentDidMount（）{
this.setState（{spHeight:this.props.spHeight}）；
如果(
this.props.spHeight.filter(
check=>check.spWeight==='One'
).长度>0
) {
this.setState（{value:0}）；
}否则如果(
this.props.spHeight.filter(
check=>check.spWeight===“两个”
).长度>0
) {
this.setState（{value:1}）；
}
}
handleChange=（事件、值）=>{
log（'handleChange-value'，value）；
this.setState（{value}）；
};
handleSportsRadioValueChange=（类别、值）=>{
log（'handleSportsRadioValueChange-category'，category）；
log（'handleSportsRadioValueChange-value'，value）；
this.setState（{spLength:value}）；
};
render（）{
const{classes，data}=this.props；
让udVal=''；
让饥饿=''；
udVal=data.udVal？data.udVal[0]。编号：“”；
饥饿=数据。饥饿？数据。饥饿[0]。编号：“”；
const{canEdit，value}=this.state；
const{spHeight}=this.state；
返回(
check.spWeight==“一”
).length==0
“没有”
: '',
颜色：值==0？'#1976D2'：'#66696C'，
}}
label={`组(${
this.state.spHeight.filter(
检查=>
check.spWeight==“一”
).长度
})`}
图标={
}
班级={{
root:classes.tabRoot，
选中：classes.tabSelected，
包装器：classes.alignment，
}}
/>
检查重量===
“两个”
).length==0
? '没有
: '',
颜色：值==1？'#1976D2'：'#66696C'，
}}
label={`Two(${
this.state.spHeight.filter(
检查=>
检查重量===
“两个”
).长度
})`}
图标={
}
班级={{
root:classes.tabRoot，
选中：classes.tabSelected，
包装器：classes.alignment，
}}
/>
{value===0&&(
{' '}
{
这是我的国家({
长度：e.target.value，
});
}}