console
function add1() {
store.dispatch({ type: 'add' ,payload:1})
}
function add2() {
store.dispatch({ type: 'add',payload:2 })
}
function addIf(){
var oldState = store.getState()
if(oldState % 2 === 1){
store.dispatch({type:'add',payload:1})
}
}
function addAsync(){
setTimeout(() =>{
store.dispatch({type:'add',payload:1})
},2000)
}
function render(sto) {
var app = document.querySelector('#app')
app.innerHTML = `
<div>
你点击了<span id="valye">${store.getState()}</span>次
<div>
<button id="add1" onclick="add1()">+1</button>
<button id="add1" onclick="add2()">+2</button>
<button id="minus1">-1</button>
<button id="add1IfOdd" onclick="addIf()">如果是单数就+1</button>
<button id="add1AfterSec" onclick="addAsync()">2秒钟后+1</button>
</div>
</div>
`
}
function stateChanger(state,action){
if(state === undefined ){
return 0
}else{
if(action.type === 'add'){
var newState = state +action.payload
return newState
}else{
return state
}
}
}
var store = Redux.createStore(stateChanger)
render(store)
store.subscribe(() =>{
render(store)
})
<script src="https://cdn.bootcss.com/react/16.8.6/umd/react.production.min.js"></script>
<script src="https://v/react-dom/16.8.6/umd/react-dom.production.min.js"></script>
<script src="https://cdn.bootcss.com/redux/4.0.1/redux.min.js"></script>
<div id="app">
</div>