Búsqueda de sitios web

javascript - React-native - drawerLabel basado en la ubicación del usuario


Tengo una aplicación en react-native, necesito mostrar un elemento de menú según la ubicación del usuario, sin embargo, la función que devuelve la ubicación del usuario es una función asíncrona y estoy obteniendo un valor indefinido, así que mi pregunta es ¿cómo puedo establecer el valor de drawerLabel de navigationOptions basado en la ubicación del usuario?

static navigationOptions = () => ({
    drawerLabel: () => (OptionsDrawer.isOptionsItemAvaliable() ? 'Options' : null)
})




private static isOptionsItemAvaliable() {
    navigator.geolocation.getCurrentPosition((result) => this.setUserLocation(result.coords), ()=> {console.log("Failed to load user location")};
    return verifyUserLocation(userLocation);
}

private static setUserLocation(coordinates){
    userLocation = coordinates; //userLocation is a global variable
}

private static verifyUserLocation(coordinates){
//Code to check the user location and returns if it's inside the allowed area
}

Respuesta #1

Intenta reemplazar el título con un componente personalizado. En el componente, puedes mantener la ubicación como un estado que actualices cuando la ubicación cambie. Algo así:

class HomeScreen extends React.Component {
  static navigationOptions = {
    headerTitle: <LogoTitle />,
  };
}

Leer más aquí