After transitioning from React Router V3 to V4 I can no longer get the React Transition Group Low-level API to work. The documentation of React Router shows an example of the High level API with CSS animations which do not work with the Low level JS flavor.
Anyone managed or knows to get this to work?
It's been a month so I guess you found your way around, but it may help others.
I created this : https://www.npmjs.com/package/react-router-v4-transition after I encountered the same problem.
It provides a kind of transition-group in a switch component. Appart from changing your Switch to TransitionSwitch, it shouldn't require big changes.
I'm going to publish an update in the following days, probably Monday, that solves a little issue with the components implementing the lifecycle hooks.
Related
we working with expo and using mapview, however, there are many restrictions in react native maps, as we are planning to implement turn by turn navigation. Integrating Mapbox would have been the best option, however we do not think it’s best to eject the project as expo doesn’t still support Mapbox. Although, I came across a package, react native maps navigation, I would like to know if anyone has been able to successfully implement it in their project and it functioned properly, and also know if there are any drawbacks that comes along with it. I am asking this because the author says “Please note that this module is usable but still under heavy development. Some properties and/or component names might change without notice.”
Kindly give your suggestions and advice. Thanks
Mapbox works very well in a react-native projects and recommend to use this service for your project but effectively, it don't works with expo so for me, you should eject your project to use it.
I paste here some packages I used for a GPS project (The last one is to get the current position of an user)
react-native-mapbox-gl/maps
mapbox-sdk
react-native-geolocation
Hope that could help you
has anybody being able to use the new Context API introduce in react 16.3 with react-native-navigation?
I'm having trouble trying to set it up as with react-native-navigation there is no main component where i can manage a state and then render the Context.Provider components, just the Navigation.startSingleScreenApp or similar functions.
Tks in advance for any help you can provide
Environment
React Native Navigation version: 1.1.403
React Native version: 0.55.4
Platform(s): iOS
Device info : Simulator
Please update your question with the simplest code example that shows your problem.
Generally, you can wrap your for example outside or inside whatever is your .
Maybe see this guide https://medium.com/#505aaron/a-practical-react-native-problem-solved-with-the-context-api-eecaf2e05202 for a simple enough example that does create a custom Context Provider/Consumer pair that also has its own state.
react-native-navigation with Context API is not possible. there are some workarounds (https://github.com/wix/react-native-navigation/issues/3549#issuecomment-411800487) but it is not the real React Context API behavior. (https://github.com/wix/react-native-navigation/issues/3549#issuecomment-427603125)
I've been thinking of which long term solution navigation library to use for react native. I'm comparing react-navigation and react-native-navigation (both their version 2) as of the moment.
My criteria would be stability and performance. Any suggestion which one to use?
React Native Router Flux https://github.com/aksonov/react-native-router-flux offers great integration with Redux and I have never experienced any stability issues. The major issues I did encounter where though:
Customizing the Navbar was a pain
Handling the Android Back button required me to implement a routingUtility which checked the currentPage and then performed Navigation. It also has a lot more activity with far less issues and pull requests and is more frequently updated.
Navigation Experimental, Navigator, Flux-style Navigation etc. etc. There are so many theories and options out there. I know, this is a question with a very high "it depends" potential. But maybe some of you have already figured out an absolute favourite option to handle navigation for react native apps.
I'm a redux user and use https://github.com/aksonov/react-native-router-flux/ . You can integrate it with redux. React-native-router-flux is also usable without Redux.
The advantage is that the Navigation API doesn't change as much as React-native's does. There is also pretty good community support.
If you start application you can use this starter kit https://github.com/infinitered/ignite. This starter kit contain redux and React-native-router-flux. And more
features (Battle Tested, redux persist, ...)
I'm starting with react native and I have a little experience with React, Because of that I want to use redux, react-router, and react-router-redux, which I have used in the past for a web React app.
All those packages can be used in react-native, except for react-router, the closest I could find is react-router-native which seems to work much like the browser version. So far so good, I made a quick and dirty app to test the router, redux, etc.
But I'm having some issues I can't figure out how to solve or debug: When changing the visuals like the text or some styles, the HMR seems to work fine, applying the changes in real time, but when I change some other module/file, like the container element (where the redux connect() function is called) or some code on the reducers, the HMR doesn't change anything and I have to reload all the app to see the changes.
Here is my code: https://github.com/DenJohX/test-react-router-native It basically just changes the color of some text by toggling a variable in the redux store. Sorry for just linking it but I think its better to show you all the folders and project structure, maybe I'd just goofed something in there or didn't use the correct folder structure.
I'm using https://github.com/jhen0409/react-native-debugger to debug the app, and by the console messages, the HMR does run and patches something but without affecting the current loaded code.
To test the problem, try to edit the colors in src/screens/pageOneContainer.js, the HMR should change the code, re-render the screen, and show the new colors, but they just stays the same.
Thanks in advance.