ReferenceError: anchorEl is not defined

Question

I am still new in reactjs.I try to use popover function in my code but it says that anchorEl is not declare,and i dont know where should i declare it.Here is my code.I am really appreciate if you can help me.

---

class TropicalListNonMapped extends Component {  
  constructor(props) {
    super(props);
    this.state = {
      anchorEl: null,
      setanchorEl: null,
      open: false,
      data: [],
      columns: [
        [

          {
            dataField: "",
            text: "Tindakan",
            formatter: (cell, row) => (
              <div
                style={{ textAlign: "left" }}
                className={this.props.classes.divAction}
              >
                <Button
                  onClick={(e) =>
                    this.setState({ open: true, anchorEl: e.currentTarget })
                  }
                >
                  <Ionicon icon="md-more" />
                </Button>
                <Popover
                  open={open}
                  anchorEl={anchorEl}
                  onClose={() => this.setState({ open: false })}
                  anchorOrigin={{
                    vertical: "bottom",
                    horizontal: "center",
                  }}
                  transformOrigin={{
                    vertical: "top",
                    horizontal: "center",
                  }}
                  classes={{ paper: classNames(classes.popover) }}
                >
             
                </Popover>
              </div>
         

        
   

Answer 1

In the Popover component you need to modify your prop:

anchorEl={this.state.anchorEl}