javascript-redux thunk不'；不要等待任何承诺

我有一个这样的数组

array =[ {message:'http://about.com'}, {message:'http://facebook.com'}]

我想循环该数组，在每个项目上，我都会请求服务器获取opengraph数据，然后将数据保存回数组。这就是我所期望的

array =[ 
    {
        message: { url:'http://about.com', title:'about'}
    }, 
    {
       message:{ url:'http://facebook.com', title:'facebook'}
    }
]

然后当一切结束。我想调度一个有效负载为预期数组的操作。我是这样做的

return dispatch => {

    let array =[ {message:'http://about.com'}, {message:'http://facebook.com'}]

    let quests = array
    .map( (item) => {
        axios.get(getOpenGraphOfThisLink + item.message)
        .then( result =>{
            item.message = (result.data)
            return result
        })
    })

    Promise.all(quests).then( () => {
        console.log( 'modified', array)
        dispatch({
            type   : constant.GET_POST_COLLECTION_SUCCESS,
            payload: array
        })
        // this dispatch function sends my original array instead of modified one.
    })
}

---

问题是：代码中的dispatch函数会将我的原始数组发送到reducer，而不是修改后的数组。我想发送新修改的数组。我认为应该是这样的，不是吗？

现在

任务

变量只是由您的原始数组分配的，因为

映射

函数返回无效，但是您需要将每个项目的承诺返回到

任务

，所以只需添加

返回

关键字，这样您的代码如下：

let quests = array
    .map( (item) => {
        return axios.get(getOpenGraphOfThisLink + item.message)
        .then( result =>{
            item.message = (result.data)
            return result
        })
    })

---

这是一个范围问题。您肯定引用了错误的变量：

return dispatch => {

    let array =[{ // <- the original array
      message:'http://about.com'
    }, {
      message:'http://facebook.com'
    }]

    let quests = array.map( (item) => {
        axios.get(getOpenGraphOfThisLink + item.message)
        .then( result =>{
            item.message = (result.data)
            return result
        })
    })

    Promise.all(quests).then(() => {
        console.log( 'modified', array) // <- here, array is reference to the original array
        dispatch({
            type   : constant.GET_POST_COLLECTION_SUCCESS,
            payload: array
        })
        // this dispatch function to send my original array instead of modified one.
    })
}

---

如果我理解正确的话，在每个请求都使用

result.data

完成后，您正在变异

array.message

依我看，你不应该这么做

let quests = array.map((item) => {
    return axios.get(getOpenGraphOfThisLink + item.message)
                .then(result => result.data)
})

Promise.all(quests).then((values) => {
  // values contains all the result data.
}

---

不要忘记处理错误情况。

允许函数改变传递给它的项通常不是好的做法

在这种情况下，如果某些axios.get（）成功，而另一些失败，那么最终将得到一个部分变异的数组，这很可能是不可取的

相反，您可以映射到原始项目的变异克隆数组，并将映射的数组沿着承诺链传递

假设不涉及“getter”，您可以使用

Object.assign（）

执行克隆的克隆和变异

let quests = array.map(item => {
    return axios.get(getOpenGraphOfThisLink + item.message)
    .then(result => Object.assign({}, item, { message: result.data });
});

return Promise.all(quests).then(arr => {
    console.log('mapped', arr); // note 'mapped', not 'mutated'
    // 'x'
    dispatch({
        'type': constant.GET_POST_COLLECTION_SUCCESS,
        'payload': arr
    });
});

现在，如果您真的想对原始数组进行变异，您可以在点“x”处进行全有或全无变异，方法是：

Object.assign(array, arr);

---

返回axios work，但在中添加数组参数，则函数将不起作用。所以现在我的代码只添加了“return”关键字，它就可以工作了。直截了当地说是的，但要注意我的答案中的但书。我也遇到了类似的情况，有什么办法解决这个问题吗

Object.assign(array, arr);