Javascript 使用redux thunk在取消公告的函数中分派操作
我有以下取消公告的函数,每次用户输入用户名字段时都会调用该函数。它正在按预期工作Javascript 使用redux thunk在取消公告的函数中分派操作,javascript,reactjs,redux,react-redux,redux-thunk,Javascript,Reactjs,Redux,React Redux,Redux Thunk,我有以下取消公告的函数,每次用户输入用户名字段时都会调用该函数。它正在按预期工作 export const uniqueUsernameCheck = _.debounce(({ username }) => { axios.post(`${API_URL}/signup/usernamecheck`, { username }) .then((res) => { console.log('Is unique?', res.data.status);
export const uniqueUsernameCheck = _.debounce(({ username }) => {
axios.post(`${API_URL}/signup/usernamecheck`, { username })
.then((res) => {
console.log('Is unique?', res.data.status);
})
.catch((error) => {
console.log(error);
});
}, 500);
然而,使用redux thunk,我试图修改函数,以便可以在函数中分派操作。这就是我所拥有的:
export const uniqueUsernameCheck = _.debounce(({ username }) => {
console.log('I can see this');
return (dispatch) => {
console.log('But not this');
dispatch({ type: USERNAME_CHECK });
axios.post(`${API_URL}/signup/usernamecheck`, { username })
.then((res) => {
dispatch(authError(res.data.error));
})
.catch((error) => {
console.log(error);
});
};
}, 500);
问题在于,上面的代码不再像初始函数那样发出post请求,并且没有任何内容被调度。我知道我做错了什么,但搞不清是什么
编辑:
这就是我建立店铺的方式
conststore=createStore(reducer,{},applyMiddleware(ReduxThunk))代码>看看这个:
两个注意事项:必须分派直接接收“分派”的函数;您必须只创建一次解盎司函数。
const userService = _.debounce(username => {
setTimeout(
()=>{
console.log('userService called after debounce. username:', username)
}
,1000)
}, 500)
const uniqueUsernameCheck = (username) => (dispatch) => {
console.log('I can see this')
userService(username)
}
console.log('begin')
const reducers = (action) => {console.log(action)}
const store = Redux.createStore(
reducers,
{},
Redux.applyMiddleware(ReduxThunk.default))
store.dispatch(uniqueUsernameCheck('rafael'))
store.dispatch(uniqueUsernameCheck('rafael'))
store.dispatch(uniqueUsernameCheck('rafael'))