Skip to content

Instantly share code, notes, and snippets.

@juwencheng
Created May 22, 2017 02:57
Show Gist options
  • Save juwencheng/8da308e84398c74cf00f9bdf172d0e92 to your computer and use it in GitHub Desktop.
Save juwencheng/8da308e84398c74cf00f9bdf172d0e92 to your computer and use it in GitHub Desktop.
Redux simple demo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://fb.me/react-with-addons-15.1.0.js"></script>
<script src="https://fb.me/react-dom-15.1.0.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.0.4/redux.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/expect/1.20.2/expect.js"></script>
</head>
<body>
<script id="jsbin-javascript">
'use strict';
var counter = function counter(state, action) {
if (state === undefined) state = 0;
if (typeof state === 'undefined') return 0;
if (action.type === 'INCREMENT') {
return state + 1;
} else if (action.type === 'DECREMENT') {
return state - 1;
} else return state;
};
expect(counter(0, { type: 'INCREMENT' })).toEqual(1);
expect(counter(1, { type: 'INCREMENT' })).toEqual(2);
expect(counter(2, { type: 'DECREMENT' })).toEqual(1);
expect(counter(1, { type: 'DECREMENT' })).toEqual(0);
expect(counter(1, { type: 'SOMETHING_ELSE' })).toEqual(1);
console.log("Test Passed!");
var render = function render() {
document.body.innerText = store.getState();
};
var _Redux = Redux;
var createStore = _Redux.createStore;
var store = createStore(counter);
store.subscribe(render);
render();
document.addEventListener('click', function () {
store.dispatch({ type: 'INCREMENT' });
});
</script>
<script id="jsbin-source-javascript" type="text/javascript">const counter = (state = 0, action) => {
if (typeof state === 'undefined')
return 0;
if (action.type === 'INCREMENT') {
return state + 1;
} else if (action.type === 'DECREMENT') {
return state - 1;
} else
return state;
}
expect (
counter(0, {type:'INCREMENT'})
).toEqual(1);
expect (
counter(1, {type:'INCREMENT'})
).toEqual(2);
expect (
counter(2, {type:'DECREMENT'})
).toEqual(1);
expect (
counter(1, {type:'DECREMENT'})
).toEqual(0);
expect (
counter(1, {type:'SOMETHING_ELSE'})
).toEqual(1)
console.log("Test Passed!")
const render = () => {
document.body.innerText = store.getState();
}
const { createStore } = Redux;
const store = createStore(counter);
store.subscribe(render);
render();
document.addEventListener('click', () => {
store.dispatch({type:'INCREMENT'});
});</script></body>
</html>
'use strict';
var counter = function counter(state, action) {
if (state === undefined) state = 0;
if (typeof state === 'undefined') return 0;
if (action.type === 'INCREMENT') {
return state + 1;
} else if (action.type === 'DECREMENT') {
return state - 1;
} else return state;
};
expect(counter(0, { type: 'INCREMENT' })).toEqual(1);
expect(counter(1, { type: 'INCREMENT' })).toEqual(2);
expect(counter(2, { type: 'DECREMENT' })).toEqual(1);
expect(counter(1, { type: 'DECREMENT' })).toEqual(0);
expect(counter(1, { type: 'SOMETHING_ELSE' })).toEqual(1);
console.log("Test Passed!");
var render = function render() {
document.body.innerText = store.getState();
};
var _Redux = Redux;
var createStore = _Redux.createStore;
var store = createStore(counter);
store.subscribe(render);
render();
document.addEventListener('click', function () {
store.dispatch({ type: 'INCREMENT' });
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment