diff --git a/content/posts/2022.05.01.react-navigation-path-as-parameter.md b/content/posts/2022.05.01.react-navigation-path-as-parameter.md index 8582e5c..8305368 100644 --- a/content/posts/2022.05.01.react-navigation-path-as-parameter.md +++ b/content/posts/2022.05.01.react-navigation-path-as-parameter.md @@ -1,6 +1,7 @@ --- title: "Using a path as a parameter in React Navigation" date: 2022-05-01T17:49:02-04:00 +lastmod: 2022-05-09T04:28:00-04:00 draft: true toc: false images: @@ -117,7 +118,8 @@ export const LINKING = { return state; }, getPathFromState: (state: any, config: any) => { - const route = state.routes[0]; + // Getting the "top route" if we're using a stack navigator + const route = state.routes[state.routes.length - 1]; // For the Dashboard routes only... if (route?.name === "Dashboard") { // ...directly put the path into the URL @@ -133,3 +135,11 @@ export const LINKING = { I'm not sure how the get the types to be a little nicer, but just going with `any` is fine for me in this case since it's a very small portion of the codebase. + + +> Edit: Made the following change after noticing that this code didn't work with a stack navigator +> +> ```ts +> // Getting the "top route" if we're using a stack navigator +> const route = state.routes[state.routes.length - 1]; +> ``` \ No newline at end of file diff --git a/content/posts/2022.05.09.react-navigation-web-browser-history-with-link.md b/content/posts/2022.05.09.react-navigation-web-browser-history-with-link.md new file mode 100644 index 0000000..33e6719 --- /dev/null +++ b/content/posts/2022.05.09.react-navigation-web-browser-history-with-link.md @@ -0,0 +1,59 @@ +--- +title: "React Navigation on web, getting browser history to work with links" +date: 2022-05-09T04:12:24-04:00 +toc: false +images: +tags: + - dev + - react + - javascript + - typescript +--- + +I've hit another issue with React Navigation when building it with React Native for Web. +The issue is with the browser history integration and ``s. +React Navigation supports browser [history API](https://developer.mozilla.org/en-US/docs/Web/API/History_API) +when targeting the web, but it wouldn't add new URLs to the history when navigating +using `( + props: TextProps & { + screen: Route; + params: RoutingStackParams[Route]; + }, +) { + return ( + + {props.children} + + ); +} +```