Как обработать асинхронное поведение navigator.geolocation.getCurrentPosition () в Redux и сохранить в Redux состояние пользователя? - PullRequest
Новая
       5

Как обработать асинхронное поведение navigator.geolocation.getCurrentPosition () в Redux и сохранить в Redux состояние пользователя?

0 голосов
/ 21 декабря 2018

Как справиться с асинхронным поведением navigator.geolocation.getCurrentPosition () в Redux и сохранить в Redux состояние пользователя?

Я недавно начал использовать Redux.Я хочу сохранить пользовательские координаты в состоянии Redux, чтобы мне не приходилось вызывать их на всех страницах моего приложения.Я использую redux-thunk, который работает нормально, когда я использую его для обработки асинхронного поведения, извлекающего данные из API.Но он не работает должным образом, когда я хочу обработать асинхронное поведение из метода navigator.geolocation.getCurrentPosition. 

// Action file

export function getUserLocation() {
    return dispatch => {
        const geolocation = navigator.geolocation;
        geolocation.getCurrentPosition(position => {
            console.log('position.coords', position.coords); // Getting the expected object
            dispatch({
                type: GET_USER_LOCATION,
                payload: position
            });
        });
    };
}


// Reducer file

import { GET_USER_LOCATION } from '../constants/ActionTypes';

function userLocationReducer(state = {}, action) {
    switch (action.type) {
        case GET_USER_LOCATION:
            console.log('action.payload', action.payload); // Getting the expected object
            return { ...action.payload };
    }
    return state;
}

export default userLocationReducer;


// View file

componentDidMount() {
    this.props.getUserLocation(); // Calling as expected
}

render() {
    console.log(this.props.userLocation) // Always an empty object...
}

Я ожидал, что this.props.userLocation НЕ будет пустым объектом при вызове его в рендереметод моего компонента представления, но он всегда пуст.

Я уверен, что this.props.userLocation правильно подключен через метод mapStateToProps (я попытался передать случайный объект без этих асинхронных методов из файла действия, и яполучаю это на виду).Я предполагаю, что моя проблема связана с асинхронным поведением getCurrentPosition (), и я не могу понять, как отправить его, как только я получил позицию пользователя, а не раньше.Спасибо за вашу помощь.

...