flyandi / react-native-maps-navigation

Enables custom navigation in react-native-maps
134 stars 54 forks source link

Problems with function based React Native #22

Open SArrueLorca opened 2 years ago

SArrueLorca commented 2 years ago

Hi. I want to make an app that uses Turn by Turn navigation exclusively. However my code is function based instead of using classes as the provided example, due to limitations with React Navigation. That's the code that i used:

                          <MapView
                              ref={ref => this.refMap = ref}
                              provider={PROVIDER_GOOGLE}
                              style={{  flex: 1}}

                              initialRegion={{
                                  latitude: 37.78825,
                                  longitude: -122.4324,
                                  latitudeDelta: 0.0922,
                                  longitudeDelta: 0.0421,
                              }}
                          >
                              <MapViewNavigation
                                  origin={coordenada}
                                  destination='132 Wilmot St, San Francisco, CA 94115'
                                  navigationMode= {NavigationModes.IDLE}
                                  travelMode= {TravelModes.DRIVING}
                                  ref={ref => this.refNavigation = ref}
                                  map={() => this.refMap}
                                  apiKey={GOOGLE_API_KEY}
                                  simulate={true}
                                  onRouteChange={route => console.log(route)}
                                  onStepChange={(step, nextStep) => console.log(step)}
                                  displayDebugMarkers={true}
                                  onNavigationStarted={route => console.log("Navigation Started")}
                                  onNavigationCompleted={console.log("Pendiente")}
                              />
                          </MapView>

And i receive an error related to this.refMap, this.refNavigation and navigator.geolocation.watchposition. So i want to know: Is there an alternative to repair/avoid this ref dependent code without using classes?. Thanks in advance. Cierto

meerbex commented 2 years ago

Could you solve the problem