Navigation :

React Notes

Passing Arguments

export interface IProps {
  children?: React.ReactNode
}

export interface IAppParms extends IProps {
  a: number
  b: string
}

const App = (props:IAppParms) => {
  console.log(`a:${props.a}, b:${props.b}`)  // tslint:disable-line
  const root = React.useContext<RootStore>(RootContext);
  return (
    <div className="App">
    <h2>Childern</h2>
      {props.children}
      <h3>End of Children</h3>
    </div>
  );
};


// using App:
(<App a={13} b='hi'>HERE I GO</App>)

Render function must take only 1 argument thus if more parameters are required, then an interface needs to be defined.

To pass props.children we need to add that to our interface in TypeScript.