Question

我无法设置属性错误。如果我从this.state中删除此错误，则会出现错误，例如未定义“ no-undef”。解决此问题。谢谢。导入语句在那里。错误：TypeError：无法设置未定义的属性“状态”。

this.state = {
  anchorEl: null,
};

this.handleClick = event => {
  this.setState({ anchorEl: event.currentTarget });
};

this.handleClose = () => {
  this.setState({ anchorEl: null });
};

function SimpleCard(props) {
  const { classes } = props;
  const { anchorEl } = this.state;
  const open = Boolean(anchorEl);


  return (
    <Card className={classes.card}>
      <CardHeader

        action={
          <IconButton aria-label="More"
            aria-owns={open ? 'long-menu' : null}
            aria-haspopup="true"
            onClick={this.handleClick}>
            <MoreVertIcon />
            <Menu
              id="long-menu"
              anchorEl={anchorEl}
              open={open}
              onClose={this.handleClose}
              PaperProps={{
                style: {
                  maxHeight: ITEM_HEIGHT * 4.5,
                  width: 100,
                },
              }}
            >
              {options.map(option => (
                <MenuItem key={option} selected={option === 'Pyxis'} onClick={this.handleClose}>
                  {option}
                </MenuItem>
              ))}
            </Menu>
          </IconButton>
        }
        title={props.products.title}
      />

      <CardContent>
        <Typography component="p">
          {props.products.id}
        </Typography>
      </CardContent>
    </Card>
  );
}

SimpleCard.propTypes = {
  classes: PropTypes.object.isRequired,
};

export default withStyles(styles)(SimpleCard);

Answer 1

handleClose和handleClick是函数，而不是对象的方法：在它们内部使用this并没有实际意义，并且您没有无状态使用功能组件。

最简单的解决方法是切换到class based component：

class SimpleCard extends React.PureComponent {

  this.handleClick = event => {
    this.setState({ anchorEl: event.currentTarget });
  }

  handleClose = () => {
    this.setState({ anchorEl: null });
  }

  render() {
    // your current SimpleCard code here
  }

}

获取TypeError：无法设置未定义的属性“状态”

1 个答案: