从导出的函数JS中的函数获取值

Posted 2021-04-19

今天，我正在使用javascript进行项目。我有一个导出的函数A，它位于我的location.js之后的另一个文件中。当我单击时，将获得用户的位置。

但是如何从导出函数中的函数获取值？

我需要函数中的坐标。

代码：

if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(
                function(position) {
                    lat = position.coords.latitude;
                    long = position.coords.longitude;
                    coordinates = {
                        latitude: lat,
                        longitude: long
                    };
                    console.log(JSON.stringify(coordinates));
                    return coordinates;
                }, {
                   (errorHandling)
                }};

有人可以帮我吗？

感谢前进！

答案

navigator.geolocation.getCurrentPosition是一个异步函数，它基于回调原理，而不是promise。

为了获得返回的值，您需要将其转换为基于promise的函数，或者将回调函数传递给它，当有可用数据时调用该回调函数，例如

const getLocation = (callback) => {
    ....

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(
            function myLocation(position) {
                lat = position.coords.latitude;
                long = position.coords.longitude;
                callback({
                    latitude: lat,
                    longitude: long
                }); // the callback method
            },
            function(error) {
                ...
            }
        );
    } 
    ...
};

module.exports = { getLocation };

现在您可以调用函数并以类似的状态设置坐标

import Button from './button.js';

import { getLocation } from './functions/getLocation.js';

class Card extends React.Component {
    state = {
       coordinates: {}
    }
    getLocationCoordinates = () => {
        getLocation((coordinates) => {
            this.setState({coordinates})
        })
    }
    render() {
        const { lat, lng } = this.state.coordinates;
        return (
            <div id={'location'} className={'card'}>
                    ...
                    <Button function={this.getLocationCoordinates} text={'Allow Location'} />
                    ...
            </div>
        );
    }
}

export default Card;