Reputation: 53
I need to navigate to a route when I execute navigation action. I read the documentation but I did not resolve my issue. I'm using Redux-saga and React-Navigation v5.
import {put, call, select} from 'redux-saga/effects';
import {apiGet, apiGetProdutoByID} from '../../services/overAll/apiProdutos';
import {TypesProdutos} from './../ducks/produtos';
import {NavigationActions} from 'react-navigation';
export function* searchByID(action) {
try {
const response = yield call(apiGetProdutoByID, action.idProduto);
yield put({
type: TypesProdutos.SEARCH_BY_ID,
produto: response.data.data.obj,
});
const produto = yield select(state => state.produtos.dataByID);
console.log(produto);
**yield put(
NavigationActions.navigate({
routeName: action.route,
params: {produto: produto},
}),
);**
} catch (error) {
console.log(error);
yield put({type: TypesProdutos.FAIL});
}
}
Upvotes: 0
Views: 318
Reputation: 53
Reading carefully the documentation of react-navigation, I find about NavigationRef, that's provides a navigation any file of the app. So I create a file RootNavigation with the code:
// RootNavigation.js
import * as React from 'react';
export const navigationRef = React.createRef();
export function navigate(name, params) {
navigationRef.current?.navigate(name, params);
}
and on the NavigationContainer component:
import {navigationRef} from './routes/RootNavigation';
...
<NavigationContainer ref={navigationRef}>
...
<NavigationContainer />
and in the file of action with redux-saga:
export function* searchByID(action) {
try {
...
**RootNavigation.navigate(action.route, {produto: produto});**
} catch (error) {
console.log(error);
yield put({type: TypesProdutos.FAIL});
}
}
It's working!
Upvotes: 1