Question

我用vuexfire管理我的状态。现在和测试我绑定到Firebase中的每个“表”/节点。随着数据开始增长，我需要查询，所以我不会向客户端发送这么多数据。

例如。我使用db.ref（'orders'）绑定到订单“table”，但需要绑定到一个办公室的订单（所有办公室的所有订单都在同一节点中）。类似db.ref（'orders'）的东西.equalTo（xx）xx =＆gt;被选办公室的参数。有可能吗？

也许这不是一个问题，它的唯一订单具有特殊状态，因此处理订单将被删除，但在添加新办公室时会增加。例如1000个订单（但在添加新办公室时会增加）。

一些代码 -

在firebaseconfig.js

中

export const dbOfficeRef = db.ref('office')

在App.vue中

export default {
  created() {
    this.$store.dispatch('setOfficeRef', dbOfficeRef)
  }
}

在index.js（store / vuex）和actions

中

setOfficeRef: firebaseAction(({ bindFirebaseRef }, { ref }) => {
       bindFirebaseRef('office', ref)
})

我有一个办公室阵列在州。以上是vuexfire的某种扩展动作。我不能传入可能拥有param-object而不是ref，我总是得到“未定义”而且我无法到达我的getter以获取参数来设置。我想在动作中执行类似的操作，绑定到办公室桌面以获取特殊办公室（密钥） -

bindFirebaseRef('office', ref.orderByChild('officeKey').equalTo(key))

---更多代码--- index.js（商店）

import Vue from 'vue'
import Vuex from 'vuex'
import { firebaseMutations } from 'vuexfire'
import { firebaseAction } from 'vuexfire'
import { dbOfficesRef } from '../firebaseConfig'

Vue.use(Vuex)

export const store = new Vuex.Store({
    state: {
        offices: []
    },
    getters: {
        getOffices: state => state.offices
    },
    mutations: {
        ...firebaseMutations
    },
    actions: {
        setOfficesRef: firebaseAction(({ bindFirebaseRef }, { ref }) => {
            bindFirebaseRef('offices', ref)
        }),
        setOfficesRef2: firebaseAction(({ bindFirebaseRef }, { ref }) => {
            bindFirebaseRef('offices', ref.orderByChild('city').equalTo('town1'))
        })
    }
})

App.vue

<template>
  <div id="app">
    <div>

        <p><button type="button" @click="setOffice2('town1')">Uppdatera</button></p>

        <ul>
            <li v-for="office in getOffices">
                {{ office.city }}
            </li>
        </ul> 

    </div>
  </div>
</template>

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

export default {
    methods: {
    setOffice(city) {
      this.$store.dispatch('setOfficesRef', dbOfficesRef.orderByChild('city').equalTo(city))
    },
    setOffice2(city) {
      this.$store.dispatch('setOfficesRef2', dbOfficesRef.orderByChild('city').equalTo(city))
    },
  computed: {
    ...mapGetters([
        'getOffices'
    ])
  },
  created() {

    this.$store.dispatch('setOfficesRef', dbOfficesRef)

  }

}
</script>

--- FIREBASE ---

offices
  office1
    city: town1
  office2
    city: town2

Answer 1

您可以使用order和orderByChild()的组合，根据每个equalTo()的特定子属性的相等性来查询您的引用。定位特定子属性需要orderByChild()。 equalTo用于根据值匹配数据库中的项目。如果每个order的办公室属性都被称为office，则查询将如下所示：

dbOfficeRef.orderByChild("office").equalTo('someOfficeName')

在操作方面，请尝试在store.$dispatch之前/之前设置参考查询，而不是在setOfficeRef操作中实际设置。根据您是否要在选择办公室之前加载所有办公室，created()可能如下所示加载所有办公室：

created() {
  this.$store.dispatch('setOfficeRef', dbOfficeRef);
}

然后用户可能从<select>下拉列表中选择了办公室名称/值。这可以触发调度到行动setOfficeRef使用orderByChild()和equalTo()通过查询传递更新的参考：

setOffice: function(office) {
  this.$store.dispatch('setOfficeRef', dbOfficeRef.orderByChild('office').equalTo(office));
}

调用bindFirebaseRef()时，将替换任何现有绑定。绑定操作可以与原始操作保持一致：

setOfficeRef: firebaseAction(({ bindFirebaseRef }, { ref }) => {
  bindFirebaseRef('office', ref)
})

以下是一个更新的example，其中显示了对没有任何查询方法的引用的绑定，然后使用orderByChild()和equalTo绑定到引用。

希望这有帮助！

注意：按子属性查询时，您可能会看到需要添加indexOn的警告。这将添加到orders节点的Firebase规则文件中。

如何使用vuexfire查询

1 个答案: