React - accessing context in child components

251 Views Asked by At

I am using this react package - @spyna/react-store (link) in my project which is nothing but a wrapper for React Context API - createStore & withStore. But I am not able to access the react context api store values in my child component (which I set in the App component).

Actually when I try to access this.props.store.get("amount") I am getting an compilation error saying "props store does not exist". Please advise me on how to access the context in my child component. Thanks in advance.

App component:

import { createStore } from "@spyna/react-store";
class App extends React.Component<IAppProps> {
render() {
   <Route component={this.ChildComponent} />
}

 private ChildComponent= () => <Child1/>;
}

const initialValue = {
    amount: 15,
    username: {
        name: "spyna",
        url: "https://spyna.it"
    }
};

export default createStore(App, initialValue);

Child component:

import { withStore } from "@spyna/react-store";
interface ICustomProps {
...
}
interface IAppProps {
...
}
class Child1 extends React.Component<ICustomProps & IAppProps, IAuthState> {
   render() {
     return (
       <p>My Amount: {this.props.store.get('amount')}</p>
     )
   }
}
export default withStore(Child1)
0

There are 0 best solutions below