3

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

例如。我使用 db.ref('orders') 绑定到订单“表”,但只需要绑定到一个办公室的订单(所有办公室的所有订单都在同一个节点中)。类似于 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 (store/vuex) 和操作中

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

我在状态下有一个办公室阵列。以上是 vuexfire 的某种扩展操作。我不能传入可能拥有的参数对象而不是 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'))
        })
    }
})

应用程序.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
4

2 回答 2

0

我不确定我是否完全理解,但我想出了一个适合我的解决方案。我想我之前已经测试过它,但由于某种原因我放弃了那个解决方案。反正 -

  • 它不可能(对我来说)改变“参考”。
  • (对我来说)不可能从扩展动作内部到达吸气剂(或状态)。

我传递了一个有效负载而不是 ref 并且没有括号 -

(({ bindFirebaseRef }, payload)

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

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

并在行动中使用它 -

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

也许从哪里调用调度也很重要

于 2018-05-11T09:38:02.607 回答
0

order您可以使用orderByChild()和的组合根据每个特定子属性的相等性来查询您的 ref equalTo()orderByChild()是定位特定子属性所必需的。equalTo用于将数据库中的项目与值进行匹配。order如果调用each 的 office 属性office,查询将如下所示:

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

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

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

<select>然后,也许用户从下拉列表中选择了办公室名称/值。setOfficeRef这可以通过使用orderByChild()and的查询触发传递更新的 ref 的动作调度equalTo()

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

调用时bindFirebaseRef()任何现有的绑定都会被替换。你的绑定动作可以保持与原来的一致:

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

这是一个更新的示例,显示在没有任何查询方法的情况下绑定到 ref,然后使用 and 绑定到orderByChild()ref equalTo

希望这会有所帮助!

注意:通过子属性查询时,您可能会看到类似于需要添加indexOn的警告。这将添加到orders节点的 Firebase 规则文件中。

于 2018-05-03T20:16:34.420 回答