代码之家 › 专栏 › 技术社区 › Fox

带回调的重做中间件

middleware redux node.js javascript

Fox · 技术社区 · 8 年前

我非常喜欢这样写动作的概念:

function signUp(data, callback) { 
return {
    [CALL_API]: {
      type: 'SOME_TYPE',
      url: `/api/account/signup`, 
      method: 'POST',
      data: data

    }
  }
}

但是像这样的事情 signUp 我不想修改/触摸 百货商店 从服务器获取回调

在我的反应组件我有一个通过操作调用api并更改状态的操作。

  this.signUp($(form).serialize(), function(data) {  this.setState({response: data});   }.bind(this))

和操作 注册 看起来像这样

function signUp(data, callback) { 
 postRequest(
    '/api/account/signup', 
    data, 
    'POST', 
    callback)
}


function postRequest(url, data, method, callback) { 
callback(true); //// just testing  
}

正如您所看到的,与第一一

问题 :是否有方法修改redux中间件或有替代的JSON函数(类似于 CALL_API )在不接触商店的情况下接受对组件的回调?我真的很想使用 呼叫_ API 语法:)

2 回复 | 直到 8 年前

Radio- 8 年前

// Action creator    
function signUp(data, callback) { 
  return {
      type: CALL_API
      url: '/api/account/signup', 
      method: 'POST',
      data: data,
      callback: callback
  }
}

// Middleware
const actionInterceptor = store => next => action => {
    if (action.type === CALL_API) {
        postRequest(action.url, action.method, action.data, action.callback);
    }
    else {
        return next(action);
    }
}

...

const store = createStore(reducer, initialState, applyMiddleware(actionInterceptor));

Community CDub 5 年前

我非常喜欢这样写动作的概念:

...

但对于signUp之类的东西,我不想修改/触摸商店以从服务器获得回调

好的,但是使用redux有什么意义呢?

我的理解是:
你想打电话给我 dispatch(signUp(data, callback)) (简化)

您的signUp actionCreator应该如下所示:

function signUp(data, callback) {
  return function(dispatch) {
    //.. do your stuff with data..
    //.. and call your callback or pass it to another function
  }
}

对不起,如果误解了你的问题,如果还有不清楚的地方,请写评论。

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

3 月前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

3 月前

Alex · 在轻量级中同时解构和不解构变量

4 月前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

4 月前

bairog · 从按属性筛选的对象数组字典中创建值数组

4 月前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

4 月前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

4 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

4 月前

user3472810 · Angular@Output/EventEmitter返回undefined

4 月前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

4 月前