JSPM

@hashiprobr/expo-use-locator

1.0.6
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • 0
  • Score
    100M100P100Q31266F
  • License ISC

A React Hook for simplifying basic usage of expo-location

Package Exports

  • @hashiprobr/expo-use-locator
  • @hashiprobr/expo-use-locator/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@hashiprobr/expo-use-locator) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

expo-use-locator

A React Hook for simplifying basic usage of expo-location

This hook returns an object with two properties:

  • a boolean state reading, that indicates whether it is waiting for the delivery of the user's current location;

  • an asynchronous method read, that requests and returns the aforementioned location.

Before requesting, this method asks for permission to access the device, if necessary, and throws an error if it is not granted.

Peer dependencies

{
    "expo": "45.0.0",
    "expo-location": "14.2.2",
    "react": "17.0.2",
    "react-native": "0.68.2"
}

Install

With npm:

npm install @hashiprobr/expo-use-locator

With yarn:

yarn add @hashiprobr/expo-use-locator

With expo:

expo install @hashiprobr/expo-use-locator

Example

import React, { useState } from 'react';

import { View, Text, Button } from 'react-native';

import useLocator from '@hashiprobr/expo-use-locator';

export default function MyComponent() {
    const [coords, setCoords] = useState(null);

    const locator = useLocator();

    async function onPress() {
        let location;
        try {
            location = await locator.read();
        } catch (error) {
            console.error(error);
        }
        setCoords(location.coords);
    }

    return (
        <View
            style={{
                flexGrow: 1,
                justifyContent: 'center',
                alignItems: 'center',
            }}
        >
            {locator.reading ? (
                <Text>reading...</Text>
            ) : (
                coords && (
                    <Text>{coords.latitude}, {coords.longitude}</Text>
                )
            )}
            <Button title="read" onPress={onPress} />
        </View>
    );
}