У меня есть блог, в котором вы можете создать сообщение, которое отлично работает. Что я хочу сделать, так это перенаправить на вновь созданный пост после создания.
postActions.js:
export function* watchCreatePost() {
yield takeEvery(CREATE_POST, createPostSaga);
}
function* createPostSaga(action) {
const token = yield select(selectToken);
const headerParams = {
Authorization: `JWT ${token}`
};
const apiCall = () => {
let formData = new FormData();
formData.append("title", action.payload.title);
formData.append("content", action.payload.content);
formData.append("thumbnail", action.payload.thumbnail);
formData.append("tags", action.payload.tags);
formData.append("slug", generateSlug(action.payload.title));
return axios({
method: "post",
url: "/posts/",
data: formData,
headers: headerParams
})
.then(response => response.data)
.catch(err => {
throw err;
});
};
try {
const response = yield call(apiCall);
const post = {};
post[response.id] = { ...response };
yield put({ type: ADD_POST, payload: response });
} catch (error) {
console.info(error);
}
}
Как я уже сказал, это создает штраф для публикации, но я не уверен, как перенаправить после ее завершения. Я знаю, что в redux-thunk вы можете использовать .then(), но не вариант, насколько я могу судить с redux-saga.
Я мог бы использовать this.props.history.push(URL_OF_BLOG_POST), если бы знал URL поста, но не знаю, пока сага не закончится.
После yield put({ type: ADD_POST, payload: response }) добавить yield call(redirectToBlogPost)?
Это сработало бы ... если бы я знал, как работать с redirectToBlogPost. props.history недоступен в саге, и у меня нет возможности узнать URL-адрес до завершения саги, поэтому я не могу выполнить перенаправление из компонента, потому что я не знаю URL-адрес, и я не могу перенаправить из саги, потому что у него нет метода перенаправления.





Ваше действие ADD_POST, вероятно, будет управляться редуктором, который обновляет своего рода массив posts до состояния, которое, как я полагаю?
Если так
- добавить компонент phantom с функцией render, которая возвращает null
- добавить массив state.posts в его свойства состояния
- как только state.posts обновлен, вы можете перенаправить пользователя, потому что, поскольку это компонент, у вас есть доступ к истории
Если вы используете React-router или аналогичную библиотеку, вы можете импортировать функцию navigate и перенаправить пользователя внутрь саги.
Дай мне знать
Находится ли вновь созданный пост по другому URL-адресу? Если да, то
this.props.history.push(URL_OF_BLOG_POST). Или, если новое сообщение в блоге находится на той же странице, но вы просто хотите прокрутить страницу до него, тогдаReactDom.findDOMNode(DOM_NODE).scrollIntoView().