Kai*_*195 2 reactjs react-redux rtk-query
我遇到一种情况,我尝试在用户登录时获取数据,我的结构是我有两个 redux 切片,一个是 userData,另一个是 UserCartData 和
但问题是我无法在 useEffect 下使用 useGetxxxQuery 工作,这是我的代码
const Login = () => {
const user = useAppSelector(state=> state.auth);
const dispatch = useAppDispatch();
const [login] = useLoginMutation();
const [showPassword,setShowPassword] = useState<boolean>(false);
useEffect(() => {
if (user!==null){ //fecth userCart data with userData
const {data ,isLoading,isFetching }= useGetCartByIDQuery(user.user?._id!)
}
}, [dispatch])
return (
<Container>
<Wrapper>
<Title>SIGN IN</Title>
<Formik
initialValues={{ email: "", password: "" }}
validationSchema={Yup.object({
password: Yup.string()
.min(8, 'Must be 8 characters or higher')
.required(),
email: Yup.string().email('Invalid email address').required(),
})}
onSubmit = { async (values, actions) => {
try{
const result = await login(values);
if("data" in result){
//console.log(result.data.data)
dispatch(setCredentials({user:result.data.data.findUser,token:result.data.data.cookie}))
}else{
const err = (result.error as RequestError).data.message
if(err.includes("password")){
actions.setErrors({password:err})
}else if(err.includes("Facebook")){
actions.setErrors({email:err})
}
}
}catch(err){
console.log(err)
}
}}>
//....unrelevant code
Run Code Online (Sandbox Code Playgroud)
你不需要useEffect在这里,你可以简单地使用skipToken:
import {skipToken} from '@reduxjs/toolkit/query'
const {data, isLoading, isFetching } = useGetCartByIDQuery(user.user ? user.user._id : skipToken)
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
12646 次 |
| 最近记录: |