/Javascript/React/React hooks update parent state from child

React hooks update parent state from child

const EnhancedTable = ({ parentCallback }) => {
    const [count, setCount] = useState(0);
    
    return (
        <button onClick={() => {
            const newValue = count + 1;
            setCount(newValue);
            parentCallback(newValue);
        }}>
             Click me {count}
        </button>
    )
};

class PageComponent extends React.Component { 
    callback = (count) => {
        // do something with value in parent component, like save to state
    }

    render() {
        return (
            <div className="App">
                <EnhancedTable parentCallback={this.callback} />         
                <h2>count 0</h2>
                (count should be updated from child)
            </div>
        )
    }
}

Source: stackoverflow.com

Similar codes

0 vote190 views1 answer
React input value set state on change
Javascript React
0 vote203 views1 answer
How to disable button if errors object isnt empty in react hook form
Javascript React
29 votes189 views6 answers
If react
Javascript React
63 votes204 views6 answers
React router install
Javascript React
0 vote209 views1 answer
Webpack react proxy not working
Javascript React
1 vote231 views1 answer
React multiple event handlers]
Javascript React
0 vote197 views1 answer
Implement cai webchat in react native
Javascript React
0 vote179 views1 answer
Hide urls in .env in react app
Javascript React
2 votes314 views1 answer
Get current screen name react navigation
Javascript React
0 vote191 views1 answer
React keydown event listener
Javascript React