adrianhajdin / ecommerce_sanity_stripe

Modern Full Stack ECommerce Application with Stripe
https://jsmastery.pro
2.21k stars 675 forks source link

> _No description provided._ #98

Open muskan-Bansal opened 1 year ago

muskan-Bansal commented 1 year ago

No description provided.

it works if wrap it in _app.js file this way

function MyApp({ Component, pageProps }) { return ( <>

</>

); }

But now the problem is functions we passed in the context api like incQty doesnt change the state of qty on click

Could you please tell me what exactly is going wrong

SoumyaSubhrajit commented 1 year ago

hi, @muskan-Bansal the problem you are facing in the code is , in the context/SateContext.js we have the coutomize hooks by using createContext() and useContext(Context) by this we can pass our custom props in multiple component , so if we wrap StateContext in _app.js by this we make sure we can pass our props in side all component underneath it.

so the code will be like this -

`import React from 'react'; import { Toaster } from 'react-toastify' // import 'ecom/styles/globals.css' import '../styles/globals.css'; import { Layout } from '../components/Layout'; import { StateContext } from '../context/StateContext';

export default function App({ Component, pageProps }) { return (

// It means we can pass the data from StateContext to every single components inside of it...
<StateContext>
  <Layout>
    {/* THIS SHOWING ERROR */}
    {/* <Toaster /> */}
    <Component {...pageProps} />
  </Layout>
 </StateContext>

) } `

Hope it solve your error..