VueFire this.$databaseBind(...).then 不是 function

Question

我正在嘗試使用從 VueFire 方法$databaseBind返回的 promise（這里是 VueFire 文檔），但不幸的是，我不知道為什么我有錯誤this.$databaseBind(...).then() is not a function。

我知道當我們嘗試在非 promise 值上調用 then 時會出現此錯誤，但是$databaseBind應該返回 promise。在 codesandbox https://codesandbox.io/s/strange-borg-y41d0u?file=/src/中復制App.vue

這是我的 main.js

import { createApp } from "vue";
import App from "./App.vue";
import { VueFire, VueFireDatabaseOptionsAPI } from "vuefire";

createApp(App)
  .use(VueFire, {
    modules: [VueFireDatabaseOptionsAPI()],
  })
  .mount("#app");

package.json

{
  "name": "happy-new-year",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.8.3",
    "firebase": "^9.15.0",
    "vue": "^3.2.13",
    "vuefire": "^3.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.16",
    "@babel/eslint-parser": "^7.12.16",
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-plugin-eslint": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "eslint": "^7.32.0",
    "eslint-plugin-vue": "^8.0.3"
  },
}

firebase.js

import { initializeApp } from "firebase/app";
import { getDatabase } from "firebase/database";
import "firebase/database";
import "firebase/storage";
import "firebase/auth";

const config = {};
export const fb = initializeApp(config);
export const db = getDatabase(fb);

和用法

<template>
  <div>{{ testObject.$value }}</div>
</template>

<script>
import { ref } from "firebase/database";
import { db } from "@/plugins/firebase";
export default {
  name: "App",
  data() {
    return {
      testObject: {},
    };
  },
  mounted() {
    this.$databaseBind("testObject", ref(db, path)).then();
  },
};
</script>

有人有什么建議嗎？ 非常感謝！

Answer 1

VueFire 有一個內部錯誤。 他們已經修好了。