React Redux异步操作处理

时间:2016-10-20 14:32:46

标签: javascript reactjs redux

我有处理输入onChange的一般功能:

export function onChange(e) {
    return (dispatch) => {
        const payload = {};
        payload[e.target.id] = e.target.value;
        dispatch({
            type: e.target.name,
            payload
        })
    }
}

在某些输入更改后(例如,设置每个表我想要获取多少行数30或60)我需要触发获取功能。

但是当我在onChange之后调用fetch()函数时 - 在onChange之前启动提取会改变请求url的部分 - 请求是incorect。

如何在onChange更改redux状态后处理此类异步操作以进行strt提取

修改
我想要调用的第二个函数是

export function searchContacts(e, props) {

return (dispatch) => {
    let propsReceived = props.allContacts;

    let searchString = "?page="      + propsReceived.paginate +
                       "&orderBy="  + propsReceived.order    +
                       "&sortedBy=" + propsReceived.sort     +
                       "&limit="    + propsReceived.limit;
    if(e){
        let search = e.target.value;
        searchString += "&search=first_name:" + search +";first_name:"+ search;
    }
    let url = ALL_CONTACTS + searchString;
    return  dispatch(getContacts(url));
}

我将这两个函数称为:

<select className="input-select select-contacts-nav"
        onChange={(e)=>{
                 this.props.onChange(e);
                 this.props.searchContacts(null, this.props);
        }}
        value={this.props.allContacts.limit}
        id="limit"
        name="ALL_CONTACTS"
>
    <option value="30"> 30</option>
    <option value="60"> 60</option>
    <option value="100">100</option>
</select>

但是this.props.searchContactsthis.props.onChange

之前开始

1 个答案:

答案 0 :(得分:0)

我的问题出在onChange事件中 - 它有“待定状态转换”。 更多信息 - React form onChange->setState one step behind