firebase - Vue.js 和 Firebase - 基于路由参数返回查询

Question

我正在 Vue.js 中做一些事情，我需要将来自 vue-router 的值（符号）传递到 Firebase 数据库查询中，以检索与该查询匹配的 JSON 对象。我只能通过模板中的 v-for / v-if hack 来做到这一点。我知道必须有一种方法可以在我的脚本标签中简单地返回这个查询。

我可以通过 vuefire 插件访问数据库。

  <template>
  <div>
    <h3>Edit Crypto</h3>
    <div v-for="crypto in getCryptos" :key="crypto[symbol]">
      <div v-if="crypto.symbol === symbol">
      {{ crypto.name }} - {{ crypto.symbol }}
      </div>
    </div>
    <div>
      {{ cryptoTest }}
    </div>
  </div>
</template>

dbCryptosRef是数据库（下图）参考。getCrypto是我试图用来查询数据库的方法。下面是同一文件中的脚本标记。dbCryptosRef.equalTo(this.$route.params.symbol)只是返回 firebase 数据库的 url，而不是 JSON 对象。我究竟做错了什么？

<script>
import { mapGetters } from 'vuex'
import { dbCryptosRef } from '../firebaseConfig'

export default {
  data()
    {
      return {
        symbol: this.$route.params.symbol,
        crypto: {},
        cryptoTest: {}
      }
    },
    computed: {
      ...mapGetters ([
        'getCryptos'
      ])
    },
    methods: {
      getCrypto: function()
      {
        this.cryptoTest = dbCryptosRef.equalTo(this.$route.params.symbol)
      }
    },
    created() {
      this.getCrypto();
    }
}
</script>

Answer 1

你需要打电话value来获取数据

getCrypto: function() {
 this.cryptoTest = dbCryptosRef.equalTo(this.$route.params.symbol).once('value').then(snapshot => {
  // do what you want with snapshot data
 })
}

您可以在Firebase 文档中阅读更多内容