React Pass function to child component

Question

I want to pass a function to a child component but I\'m getting this error.

Invalid value for prop passedFunction on

tag.

c         


        

Answer 1

Instead of having to bind your function in the constructor of the parent Class, you can use an arrow function to define your method so it is lexically bound using an arrow function

class Child extends Component {
    render() {
        

    }
}

class Parent extends Component {
    passedFunction = () => {}
    render() {
      
    }
}

To Account for older version support of Javascript:

class Child extends Component {
    render() {
        

    }
}

class Parent extends Component {
    constructor() {
        this.passedFunction = this.passedFunction.bind(this)
    }

    passedFunction() {}
    render() {
      
    }
}