В компоненте
EditProfile, в
useEffect вызываю функцию
getUserProfile, а ниже получаю данные и подставляю в форму... если вызывать через
setTimeout = 1 сек, то всё срабатывает, но если без
setTimeout, то срабатывает ошибка, так как
profile я получаю пустой...
Что может быть не так?
P.S. Есть родительский компонент где я сначала получаю данные пользователя, а потом в дочернем получаю данные профиля этого пользователя. В родительском есть метод
getUser который так же вызывается в
useEffect. Есть подозрение что сначала срабатывает
getUserProfile, а уже потом
getUser (оба метода посылают асинхронный запрос на сервер). Как пофиксить?
const App = ({ loadUser }) => {
useEffect(() => {
loadUser();
});
return (
<Switch>
<PrivateRoute exact path="/dashboard" component={Dashboard} />
<PrivateRoute exact path="/create-profile" component={CreateProfile} />
<PrivateRoute exact path="/edit-profile" component={EditProfile} />
</Switch>
);
};
App.propTypes = {
loadUser: Proptypes.func.isRequired
};
export default connect(null, { loadUser })(App);
const EditProfile = ({
profile: {loading, profile},
createProfile,
getUserProfile,
history
}) => {
const [formData, setFormData] = useState({
key1: "",
key2: "",
key3: ""
});
useEffect(() => {
// getUserProfile();
setTimeout(() => {
getUserProfile();
}, 1000);
setFormData({
key1: loading || !profile.key1? "" : profile.key1,
key2: loading || !profile.key2 ? "" : profile.key2,
key3: loading || !profile.key3 ? "" : profile.key3,
});
}, [loading, getCurrentProfile]);
const {
key1,
key2,
key3
} = formData;
const onChange = e =>
setFormData({ ...formData, [e.target.name]: e.target.value });
const onSubmit = e => {
e.preventDefault();
createProfile(formData, history, true);
};
return (
<Fragment>
{* ФОРМА*}
</Fragment>
);
};
EditProfile.propTypes = {
createProfile: Proptypes.func.isRequired,
getUserProfile: Proptypes.func.isRequired,
profile: Proptypes.object.isRequired
};
const mapStateToProps = state => ({
profile: state.profile
});
export default connect(mapStateToProps, { createProfile, getUserProfile})(
withRouter(EditProfile)
);
