Skip to content

Instantly share code, notes, and snippets.

@pedroparra

pedroparra/store-example.js

Last active February 12, 2019 07:58
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save pedroparra/c11d261fedec0b81925f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save pedroparra/c11d261fedec0b81925f to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. pedroparra revised this gist Jan 3, 2016. 1 changed file with 4 additions and 0 deletions.
    4 changes: 4 additions & 0 deletions store-example.js
    View file
    Original file line number Diff line number Diff line change
    @@ -27,6 +27,8 @@ const counter = ({value, clickSumar, clickRestar}) => {
    };

    // Renderizamos el componente.
    // Cada vez que el stado cambie, el componente
    // se volverá a renderizar.
    const render = () => {
    ReactDOM.render(
    <Counter
    @@ -38,3 +40,5 @@ const render = () => {
    );
    };

    store.subscribe(render);
    render();
  2. pedroparra created this gist Jan 3, 2016.
    40 changes: 40 additions & 0 deletions store-example.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,40 @@
    import React from 'react';
    import ReactDOM from 'react-dom';
    import { createStore } from 'redux';

    // Preparamos nuestra funcion reducer
    const myReducer = (state = 0, action) => {
    switch(action.type) {
    case 'sumar':
    return state + 1;
    case 'restar':
    return state - 1;
    default:
    return state;
    }
    }

    // Inicializamos el store pasándole el reducer
    const store = createStore(myReducer);

    // Creamos nuestro componente de react
    const counter = ({value, clickSumar, clickRestar}) => {
    <div>
    <h1>{value}</h1>
    <button onClick={clickSumar}>Sumar</button>
    <button onClick={clickRestar}>Restar</button>
    </div>
    };

    // Renderizamos el componente.
    const render = () => {
    ReactDOM.render(
    <Counter
    value={store.getState()}
    clickSumar={ ()=> store.dispatch({type: 'sumar'}) }
    clickRestar={ ()=> store.dispatch({type: 'restar'}) }
    />,
    document.getElementById('MyAppContainer');
    );
    };