No tienes acceso a esta clase

¬°Contin√ļa aprendiendo! √önete y comienza a potenciar tu carrera

Aprende Inglés, Programación, AI, Ciberseguridad y más a precio especial.

Antes: $249

Currency
$209
Suscríbete

Termina en:

1 Días
21 Hrs
12 Min
57 Seg

Integrando la API de Platzi Store

10/22
Recursos

Aportes 2

Preguntas 0

Ordenar por:

¬ŅQuieres ver m√°s aportes, preguntas y respuestas de la comunidad?

Integrando la API de Platzi Store

  • Creamos una carpeta dentro de src llamada context.
  • Dentro de context creamos el archivo AppContext.js
    AppContext.js:
import React from 'react';

const AppContext = React.createContext({});

export default AppContext; 

En App.jsx importamos AppContext:

import useInitialState from '../hooks/useInitialState';
import AppContext from '../context/AppContext';

Y lo a√Īadimos a nuestro template:

const App = () => {
  const initialState = useInitialState();
  const isEmpty = Object.keys(initialState.products).length;
  return (
    <>
    {isEmpty > 0 ? (
	// START
        <AppContext.Provider value={initialState}>
        <BrowserRouter>
          <Layout>
            <Switch>
              <Route exact path="/" component={Home} />
              <Route exact path="/checkout" component={Checkout} />
              <Route component={NotFound} />
            </Switch>
          </Layout>
        </BrowserRouter>
        </AppContext.Provider>
	// END
      ) : <h1>Loading ...</h1>}
    </>
  )
}

Y Aqui el código de Products.jsx: link

En el componente de Products, ya no es necesario usar desestructuración para acceder a products, el api ya regresa directo el array.

Quedaría así:
const products = useContext(AppContext);