如何等待 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() 中并返回