reactjs - Request Device Location on App load Ionic5-React

Question

I want my App to prompt location permission as soon as the App loads, in ionic-react. All examples are i have been seeing are for Angular.

Home.tsx

import React from "react";
import { IonButton, IonCol, IonGrid, IonPage, IonRow } from "@ionic/react";
import "./Home.css";

const Home: React.FC = () => {
 // Ask for the permission
 // useEffect will make it load as soon as the App loads

  return (
    <IonPage className="home-page">
      <div className="home-page__logo">
        <h4 className="fw-bold">PMApp Logo</h4>
      </div>
      <div className="home-page__middle-content">
        <h4 className="home-page__prim">
          Build your Performance, the Smart way.{" "}
        </h4>
        <h4 className="home-page__sec">
          Lorem ipsum dolor sit amet consectetur adipisicing elit Cupiditate
          rem.
        </h4>
      </div>
      <div className="home-page__btns">
        <IonGrid>
          <IonRow>
            <IonCol>
              <IonButton
                fill="outline"
                className="round h-btn"
                expand="block"
                color="light"
                href="/login"
              >
                Log in
              </IonButton>
            </IonCol>
            <IonCol>
              <IonButton
                color="light"
                className="round h-btn"
                expand="block"
                fill="solid"
              >
                Sign Up
              </IonButton>
            </IonCol>
          </IonRow>
        </IonGrid>
      </div>
    </IonPage>
  );
};

export default Home;

in a nutshell, at the beginning of my App, i want to save the users location to my database.

Thanks in advance....

question from:https://stackoverflow.com/questions/65916942/request-device-location-on-app-load-ionic5-react

Answer 1

Waitting for answers