Estoy tratando de pasar el estado después de onClick al componente
pero no se muestra porque no está definido. Quiero mostrar el estado como la cantidad restante de cookies en venta

class CookieContainer extends Component { render(){ return ( {amp}lt;div className="donutShop" {amp}gt; //below I want to pass the updated state but {this.props.numOfCookies} is undefined {amp}lt;h2{amp}gt;Cookies available for Sale: {this.props.numOfCookies}{amp}lt;/h2{amp}gt; {amp}lt;button onClick={this.props.buyCookie}{amp}gt;Buy cookie{amp}lt;/button{amp}gt; {amp}lt;/div{amp}gt; ); }; } 

numOfCookies: no está definido cuando se pasa como accesorio a CookieContainer

 const mapStateToProps = state ={amp}gt; ({numOfCookies: state.numOfCookies}) 
 // dispatch const mapDispatchToProps = dispatch ={amp}gt; { return { buyCookie: () ={amp}gt; dispatch(buyCookie()) }; }; let ConnectedCookie = connect(mapStateToProps, mapDispatchToProps)(CookieContainer) export default ConnectedCookie // action export const buyCookie = () ={amp}gt; { return { type: BUY_COOKIE, content: 1 }; }; // state const initialCookieState = { numOfCookies: 100 } const BUY_COOKIE = "BUY_COOKIE"; //reducer const cookieReducer = (state = initialCookieState, action) ={amp}gt; { switch (action.type) { case BUY_COOKIE: return { ...state, numOfCookies: state.numOfCookies - action.content }; default: return state; } }; 
Stak Hur

es un nuevo contribuyente a este sitio. Tenga cuidado al pedir aclaraciones, comentarios y respuestas. Mira nuestro

Código de Conducta

.

He creado un stackblitz para el código que proporcionó aquí y está funcionando para mí. El código en sí parece estar bien. El problema podría estar en lo que no ha mostrado en su pregunta. Asegúrate de haber creado tu tienda

const store = createStore(cookieReducer);

y pasó su tienda correctamente envolviendo su aplicación con el provider

  {amp}lt;Provider store={store}{amp}gt; {amp}lt;App /{amp}gt; {amp}lt;/Provider{amp}gt; 

Además, al declarar los tipos de acción (BUY_COOKIE, etc.), declare los tipos de acción en un archivo separado y puede importarlos en el reductor. Puede declarar creadores de acciones y tipos de acciones en el mismo archivo si lo desea.