React Native экспортирует асинхронную функцию в компонент

#javascript #react-native #asynchronous #axios

#javascript #react-native #асинхронный #axios

Вопрос:

Я пытаюсь экспортировать эту функцию axiosWithToken в свой компонент, чтобы при вызове ‘axiosWithToken’ она возвращала объект axios.create, чтобы я мог создать из него остальную часть моего запроса axios. Однако он работает не так, как ожидалось, но не выдает никаких ошибок. Если я извлеку этот файл и помещу его внутрь компонента, он сработает. Ниже приведен мой файл компонента, который я свернул для удобства чтения. Это также случалось со мной с другими асинхронными функциями, поэтому мне любопытно, что я делаю не так.

 import axiosWithToken from './axiosWithToken'
const response = axiosWithToken.get(....)
 

Это файл axiosWithToken

 import axios from 'axios';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { useState } from 'react';

const axiosWithToken = async () => {
  const [token, setToken] = useState('');
  try {
    const value = await AsyncStorage.getItem('@token');
    setToken(value);
    console.log(token);
  } catch (e) {
    // error reading value
    console.log('error getting value');
  }

  return axios.create({
    baseURL: 'http://10.0.2.2:3000',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${token}`,
    },
  });
};

export default axiosWithToken;
 

Ответ №1:

Вы пытаетесь получить значение из асинхронной функции без ожидания?

 const response = axiosWithToken.get(....)
                ^
              await