javascript - 如何等待js导出的api调用？

Question

我有一个 Vue 应用程序，可以在其中初始化我的 firestore 应用程序。我的代码如下所示:

if (firebase.apps.length) {
  firebase.app()
} else {
  firebase.initializeApp(config)
}
export const Firestore = firebase.firestore()
export const Auth = firebase.auth()

现在我想从一些 API 中获取配置文件。这意味着，而不是做firebase.initializeApp(配置)我想做这样的事情:

axios.get('https://.../config.json', {})
    .then(async ({ data }) => {
      firebase.initializeApp(data)
    })
    .catch((err) => {
      console.log('error', err)
    })

但是我的导出必须等到我收到 API 的响应并初始化应用程序。

如何使用 async/await 或任何其他模式使导出等待？

Answer 1

你可以这样做:

export const initialize = () => {
 try {
   return axios.get('https://.../config.json', {})
    } catch(err) {
      console.log('error', err)
    }
  }

然后在另一个js文件中，可以先导入它，然后执行以下操作:

initialize().then(data => {
firebase.initializeApp(data)
firebase.firestore()
}).catch((err) => {
    console.log(err);
});

没有必要导出 firebase.firestore()，因为如果您想使用 firestore，您将在每个 js 文件中调用它。

您真正需要导出的唯一方法是 firebase.initializeApp(data)，您可以将其添加到方法 initialize() 中并返回它