How to access props in function?

Keywords: reactjs

Question: 

I have problem with accessing props from function.

Here is my code(the component where all this is contained is also a function):

const [anchorEl, setAnchorEl] = React.useState(null);

function handleClick(event) {
    setAnchorEl(event.currentTarget);
}

function handleClose(val) {
    setAnchorEl(null);
    this.props.updateSelected(val)
}

return (
    <div>
        <IconButton onClick={handleClick}>
            <FilterListIcon/>
        </IconButton>
        <Menu
            id="simple-menu"
            anchorEl={anchorEl}
            keepMounted
            open={Boolean(anchorEl)}
            onClose={handleClose}
        >
            <MenuItem onClick={() => {handleClose(1).bind(this)}}>Содержит текст</MenuItem>
            <MenuItem onClick={() => {handleClose(2)}}>Не содержит текст</MenuItem>
            <MenuItem onClick={() => {handleClose(3)}}>Начинается с</MenuItem>
            <MenuItem onClick={() => {handleClose(4)}}>Заканчивается на</MenuItem>
        </Menu>
    </div>

I have tried binding as you see but it did't work.

Here is how I pass this prop to the component from another component:

<FilterOptions updateSelected={this.updateSelectedValue}/>

And the prop itself:

updateSelectedValue = async (val) => {
    await this.setState({selectedValue: val});
    console.log(this.state.selectedValue)
};

Answers: