Axios post方法反应.状态 Redux 不更新

Question

我在Redux中State有问题 这是我axios请求

case 'REGISTER_USER':{
var userData = {username: action.payload.username, password : action.payload.password};
axios({
method: 'post',
url: 'php/register.php',
contentType: "application/json; charset=utf-8",
dataType: "json",
data: userData
}).then(function(response) {
state.error = response.data.errors;
state.success = response.data.success;
});
return {state};
break;
}//end REGISTER_USER

默认state.error，state.success为空array。 第一次单击后state.error仍然是空数组，因为 axois 没有完成请求。第二次点击后，一切都很好。

在这里，我对道具有问题：

{this.props.error.length>0? <div className="alert alert-danger">{this.props.error[0]}</div>: ''}

并存储：

@connect((store)=>{
return{
error: store.app.error,
success: store.app.success,
}
})

你知道我如何在完成后用新Props渲染componentaxios method post吗？

Answer 1

我认为您已经将此代码编写到reducer中，api调用应该在Action Dispacher中完成。api 成功调用后，您必须将数据调度到化简器。在化简器中，你只应该分配数据，而不应该在化简器内分配API调用。

例如

操作调度程序

export function APIDispatch(data)
{
return{
type:'API_DATA_RECD',                
data:data
}
}
export function callAPI(){
return function(dispatch){
axios({
method: 'post',
url: 'php/register.php',
contentType: "application/json; charset=utf-8",
dataType: "json",
data: userData
}).then(function(response) {
state.error = response.data.errors;
state.success = response.data.success;
dispatch(APIDispatch(state))
});
}
}

还原剂

case 'API_DATA_RECD':
{   
// you will get data from action.data
}

Answer 2

Axios 正在异步发出 ajax 请求，在REGISTER_USER的情况下，它立即返回带有状态属性的对象的代码段，同时请求仍处于挂起状态，这意味着该对象没有平均值。只有在完成发出的请求时，才应返回值。

试试这个：

case 'REGISTER_USER':{
var userData = {username: action.payload.username, password : action.payload.password};
axios({
method: 'post',
url: 'php/register.php',
contentType: "application/json; charset=utf-8",
dataType: "json",
data: userData
}).then(function(response) {
state.error = response.data.errors;
state.success = response.data.success;
return {state}
});
break;
}//end REGISTER_USER