从子类刷新父函数小部件

Question

I wan to refresh parent component from child class,

I read some articles but still confusing because parent is function and child is class

I appreciate your any help thank you very much.

Parent function component

export default function HeaderLinks(props) {
  const classes = useStyles();

  return (
      <ChildWidget myHeaderLink={this}></ChildWidget>

Child Class

class AuthWidget extends React.Component {
  constructor(props) {
    super(props); 
  }
  refreshParent(){
        this.props.myHeaderLink.setState() ..??? maybe I need something equivalent to setState()?

Answer 1

I create a very small sample to display this useCase. You can check it here. Just pass prop and onClick I handle it on the parent which update the state of parent and eventually that state change leads to the Re-renders of the component. https://codesandbox.io/s/intelligent-dubinsky-w32dz?file=/src/App.js

Click on Button "Change parent Property" changes the parent state from "Hello World" to "Bye World"