我无法在子组件中更新 state

Question

i wanna change state value in child component but i getting always 'this.setState is not a function ' error

Parent Component

`

export default class Todo extends Component {
   constructor(props){
    super(props)
    this.state = { 
      propBottomMenu : false
    }
    this.bottomRef = React.createRef()
  };
  checkClose(){
    this.setState({propBottomMenu : false})
  }
  render() {
    return (
      <>
     // other codes 
     <TouchableOpacity 
         onPress={() => this.setState({propBottomMenu : false})}
         style={styles.addTask}
          >
            <FontAwesomeIcon icon={ faPlus } size={25}  color={'#fff'} />
     </TouchableOpacity>
      {this.state.propBottomMenu ? 
         <BottomMenu bSheetRef={this.bottomRef} checkClose={this.checkClose} style=                       {styles.bottomMenu} /> 
        : null}
      </> 
    )
  }
}

`

Child Component:

`

export default class BottomMenu extends Component {
    constructor(props){
        super(props)
        this.bottomRef = this.props.bSheetRef
     }
     render() {
       return (
     <>
        <BottomSheet 
            ref={this.bottomRef} 
            snapPoints={[ '40%', '60%', '90%']} 
            index={1}
            enablePanDownToClose={true}
            onChange={(index)=>{ index < 0 && this.props.checkClose() }}
           >
            // other codes 
          </BottomSheet>
        </>
      )
     }
   }
  })

`

checkClose() function working but i can't update state

Error: this.setState is not a function

Answer 1

Solution: For the function to work we must use bind or call it as arrow function

constructor(props){
super(props)
this.checkClose = this.checkClose.bind(this); // this line 
this.state = { 
  propBottomMenu : false
}
this.bottomRef = React.createRef()
};

Jsx:

<BottomMenu bSheetRef={this.bottomRef} checkClose={this.checkClose} style={styles.bottomMenu} />