如何使用vuexfire查询

Question

我用炉火来管理我的州。现在，通过测试，我绑定到Firebase中的每个“表”/节点。随着数据开始增长，我需要进行查询，这样就不会向客户端发送那么多数据。

例如。我用db.ref(' orders ')绑定到order "table“，但是只需要绑定到一个office的订单(所有办公室的所有订单都在同一个节点上)。类似于db.ref('orders').equalTo( xx ) xx =>参数。有可能吗？

也许这不是一个问题，它唯一具有特殊处理状态的订单将被删除，但随着新办公室的增加，订单数量会增加。例如，1000份订单(但在添加新办公室时会增加)。

一些密码-

在firebaseconfig.js中

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

在App.vue中

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

在index.js (存储/ vuex)和操作中

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

我在州下有一个办公室阵列。上面是一种从情绪化的延伸行动。我不能传入可能拥有param对象而不是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>

--火力

offices
  office1
    city: town1
  office2
    city: town2

Answer 1

我不确定我是否完全理解，但我想出了一个适合我的解决方案。我想我以前测试过它，但出于某种原因，我放弃了这个解决方案。总之-

• (对我来说)不可能改变“参考文献”。
• 从扩展操作内部到达getter(或state) (对我来说)是不可能的。

我传递一个有效载荷而不是裁判，周围没有括号-

(({ bindFirebaseRef }, payload)

然后我就可以传递所有数据的有效载荷-

var payload = {
    ref: ,
    state: '',
    search: '',
    searchval: 
}

在行动中使用它-

bindFirebaseRef(state, ref.orderByChild(search).equalTo(searchval))

也许从你呼叫调度的地方看，这也很重要

Answer 2

通过使用order和orderByChild()的组合，您可以根据每个orderByChild()的特定子属性的相等性对ref进行查询。orderByChild()是针对特定子属性所必需的。equalTo用于将数据库中的项与值进行匹配。如果每个order的office称为office，则查询如下：

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

在操作方面，尝试在/在store.$dispatch之前设置ref查询，而不是实际在setOfficeRef操作中设置。取决于您是否希望在选择某个办公室之前加载所有加载的办公室，created()可以如下所示来加载所有办公室：

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

然后，用户可能已经从类似于<select>下拉列表的内容中选择了一个office名称/值。这可以触发一个调度到操作setOfficeRef，使用orderByChild()和equalTo()传递一个经过更新的引用和查询。

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

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

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

下面是一个更新的示例，它显示了绑定到ref而没有任何查询方法，然后绑定到使用orderByChild()和equalTo的ref。

希望这能帮上忙！

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