Here, we will create a component using the composition API, which will fetch the user GPS position and show that information on the screen:
- Using the base example from the 'Creating the base file' section, create a new file named component.html and open it.
- In the empty <script> HTML element, create the constants of the functions that will be used using the object destructuring method, calling the createApp, defineComponent, setup, ref, onMounted, and onUnmounted methods from the Vue global constant:
const {
createApp,
defineComponent,
setup,
ref,
onMounted,
onUnmounted,
} = Vue;
- Create a fetchLocation function and, inside this, create a let variable named watcher. Then, create a constant named geoLocation and define it as navigator.geolocation. Next, create a constant named gpsTime and define it as the ref function, passing the Date.now() function as the argument. Finally, create a constant named coordinates and define it as the ref function, passing...