Javascript 未识别的道具

当点击一个按钮时，我有一个事件错误，问题是我不知道如何用钩子转换它

const Header = () => {
  const [value, setValue] = React.useState(0);

  function handleChange(event, newValue) {
    setValue(newValue);
  }

  function onLogoutClick(e) {
    e.preventDefault();
    this.props.logoutUser();
  }

  //this.onLogoutClick = this.onLogoutClick.bind(this);

  return (
    <div className={classes.root}>
      <AppBar position="sticky">
        <Tabs value={value} onChange={handleChange} centered>
          {" "}
          {/* <Tabs value={value} onChange={handleChange}>
                {sections.map(section => (
                  <Tab label={section} />
                ))}
              </Tabs> */}{" "}
          <Tab label="Indicadores Globais" />
          <Tab label="Indicadores Colaboradores" />
          <Tab label="Indicadores Produto" />
          <Tab label="Indicadores Temporais" />
          <Button
            color="inherit"
            className={classes.classesButton}
            onClick={onLogoutClick}
          >
            Logout
          </Button>

const头=（）=>{
const[value，setValue]=React.useState（0）；
函数handleChange（事件，newValue）{
设置值（新值）；
}
函数onLogoutClick（e）{
e、 预防默认值（）；
this.props.logoutUser（）；
}
//this.onLogoutClick=this.onLogoutClick.bind（this）；
返回(
{" "}
{/* 
{sections.map（section=>(
))}
*/}{" "}
注销

---

TypeError:单击按钮时无法读取未定义的属性“props”。我知道问题出在onClick={onLogoutClick}但我不知道如何解决这个问题。有什么帮助吗？

事件处理程序将使用事件对象在回调中重写

此

。要确保组件在回调中的作用域，需要将其绑定到函数

<Button
    color="inherit"
    className={classes.classesButton}
    onClick={onLogoutClick.bind(this)}
>

---

此inside onLogoutClick指向html元素。如果希望以此方式访问组件，则需要将操作与此绑定

<Button
    color="inherit"
    className={classes.classesButton}
    onClick={onLogoutClick.bind(this)}
>

---

您需要删除

this.

并将道具作为函数

头的参数接收。function
头需要参数中的道具，例如：
const Header=props=>（/*code*/）
并且在您的函数
onLogoutClick
中可以调用'props.logoutUser（）``是否尝试将此绑定到函数？类似于构造函数this.onLogoutClick=this.onLogoutClick.bind（this）中的内容
constructor(props) {
     super(props);
        this.state = {
        };
        this.onLogoutClick = this.onLogoutClick.bind(this);
 }