redux-thunk和redux-promise

字数 79阅读 413

redux-promise可以在actionCreator中返回一个promise对象,他会等待成功后将成功后的结果派发出去

// 这种写法只能派发成功的时候(resolve),失败的时候不能触发,这种写法并不常用
add(amount) {
  return new Promise((resolve, reject) => {
    resolve ({ type: "ADD", amount: 1 })
  })
}

// 这种写法成功和失败都进行派发
//如果返回一个对象,对象名字中有payload,而且payload是一个promise对象,那么他会让这个promise执行
add(amount) {
  return {
    type: "ADD",
    payload: new Promise((resolve, reject) => {
        reject (100)  //reducer中可以通过action.payload中拿到reject或resolve中的100
     })
  }
}




add(amount) {
  return {
    type: "ADD",
    payload: axios.get('http://localhost:8000/user')
     })
  }
}

redux-thunk可以在actionCreator中返回一个函数,将函数执行,并传入dispatch和getState两个参数给这个函数,我们可以在任意时候dispatch

add(amount) {
  return (dispatch,getState)=>{
    axios.get('http://localhost:8000/user').then((data)=>{
      dispatch({type:"ADD", amount: data.amount})
    })
  }
}