Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
​
<head>
<meta name="description" content="counterReducer">
  <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://wzrd.in/standalone/expect@latest"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.3.1/redux.js"></script>
</head>
​
<body>
  <div id='root'></div>
</body>
​
</html>
 
const todos = (state = [], action) => {
  switch (action.type) {
    case 'ADD_TODO':
      return [
        ...state,
        {
          id: action.id,
          text: action.text,
          completed: false
        }
      ]
    case 'TOGGLE_TODO':
            return state.map( t => {
                if(t.id === action.id) console.log('hi')
                return t.id === action.id ? 
                    { ...t, completed: !t.completed } : t )}
    default: 
      return state
  }
}
​
const Todo = ({content, status}) => {
  return (
    <div style={{border: '1px solid #ccc', display: 'inline-block', padding: 10, margin: 10}} >
      <p style={{margin: 0}}>{`content: ${content}`}</p>
      <p style={{margin: 0}}>{`status: ${status}`}</p>
    </div>
  )
}
​
​
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
kylewhpro
0viewers