Redux, Ax ios и Redux Thunk с Экспо 37 - PullRequest
0 голосов
/ 23 апреля 2020

поэтому я использую Redux redux-thunk redux-persist и ax ios все вместе, вот моя установка:

**action.js**

import axios from 'axios';
import * as type from './constants';

export const handleSignup = userDetails => async (dispatch) => {
  const {
    email, password, username, version,
  } = userDetails;
  return axios
    .post('/users/signup', {
      email,
      password,
      username,
      platform: version,
    })
    .then((res) => {
      dispatch({
        type: type.USER_SIGNUP_SUCCESS,
        payload: res.data,
      });
      axios.defaults.headers.common.Authorization = `Bearer ${
        res.data.access_token
      }`;
      return res;
    });
};

**api.js**

import axios from 'axios';
import configureStore from '../store/configureStore';

const { store } = configureStore();

axios.defaults.baseURL = 'http://baseurl/api/v1';

axios.defaults.headers.common['Content-Type'] = 'application/json';

const accesToken = store.getState().authentication.token;
if (accesToken) {
  axios.defaults.headers.common.Authorization = `Bearer ${accesToken}`;
}

axios.defaults.headers.common['Content-Type'] = 'application/json';

axios.interceptors.response.use(
  async response => response,
  error => Promise.reject(error),
);

**configureStore.js**

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { composeWithDevTools } from 'redux-devtools-extension';
import { persistStore, persistCombineReducers } from 'redux-persist';
import rootReducer from '../reducers';

import storage from 'redux-persist/lib/storage';


const persistConfig = {
  key: 'root',
  storage,
  blacklist: ['name1', 'name2', 'name3'],
};

const middlewares = [thunk];
const enhancer = composeWithDevTools(applyMiddleware(...middlewares));

const persistedReducer = persistCombineReducers(persistConfig, rootReducer);

export default () => {
  const store = createStore(persistedReducer, undefined, enhancer);

  const persistor = persistStore(store, null, () => {
    store.getState();
  });
  return { store, persistor };
};

, и я получил этот код в моем редукторе для действия успешной регистрации

case type.USER_SIGNUP_SUCCESS:
      return {
        ...state,
        ...action.payload.data.user,
        email: action.payload.data.user.email,
        username: action.payload.data.user.username,
        token: action.payload.data.access_token,
        user_id: action.payload.data.user.id,
      };

и, наконец, я звоню handleSignUp при нажатии кнопки отправки:

onSignupClicked = () => {
    this.setState({
      error: false,
      errorMessage: [],
      loading: true,
    });
    const { platform } = Constants;
    const version = Object.keys(platform)[0];
    const {
      user: { email, password, username },
    } = this.state;
    const { handleSignup, navigation } = this.props;
    handleSignup({
      email,
      password,
      username,
      version,
    })
      .then(() => {
        this.setState({ loading: true });
        navigation.navigate(NAV_INTRO);
      })
      .catch((err) => {
        console.log('ERROR : ',err)
      });
  };

извините за длинный код, так что теперь моя проблема в том, что, как только пользователь нажимает регистрацию я автоматически получаю сообщение ERROR : Network Error. я думаю, он не ждет, пока запрос будет выполнен, но меня смущает то, что этот код работает в предыдущей версии приложения с Expo 30.0.0, теперь он работает на Expo 37.0.0. и я дважды проверил API, нет проблем с этим, мой вопрос, что-то не так с его кодом? есть ли причина, по которой он возвращает Network Error так быстро?

я знаю, что это громоздко, но любое предложение было бы неплохо, спасибо.

на случай, если здесь важны мои версии:

"react-redux": "5.0.7",
    "redux": "4.0.0",
    "redux-devtools-extension": "^2.13.8",
    "redux-logger": "3.0.6",
    "redux-mock-store": "1.5.3",
    "redux-persist": "5.10.0",
    "redux-thunk": "2.2.0",
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...