vuexfire로 쿼리하는 방법

vuexfire로 쿼리하는 방법

나는 vuexfire로 내 상태를 관리했다.지금은 테스트 중이고 나는 Firebase의 각 "table" / node에 바인딩한다.데이터가 증가하기 시작하면서 나는 클라이언트에게 많은 데이터를 보내지 않기 위해 질의해야 한다.

예를 들면.db.ref('주문')로 주문 "테이블"에 바인딩하지만 하나의 사무실(모든 사무실의 주문은 동일한 노드에 있음)에 바인딩해야 한다.db.ref('주문') 같은 것.eqalTo(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 대신 parameter-object를 소유할 수 없고, 항상 "정의되지 않음"을 받으며, 매개변수를 설정하기 위해 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'))
        })
    }
})

앱뷰

<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

각 항목의 특정 자식 속성의 동일성에 기반하여 참조에 대해 쿼리할 수 있음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)
})

다음은 쿼리 방법 없이 참조에 바인딩한 다음 다음 다음 참조에 바인딩하는 작업을 보여주는 업데이트된 예입니다.orderByChild()그리고equalTo.

그게 도움이 되길 바래!

참고: 하위 속성별로 쿼리할 때 인덱스를 추가해야 하는 경우 경고가 나타날 수 있음.이것은 당신의 Firebase 규칙 파일에 추가될 것이다.orders마디를 짓다

내가 완전히 이해한지는 모르겠지만 나에게 맞는 해결책을 생각해냈다.나는 내가 전에 그것을 시험해 본 적이 있다고 생각하지만 어떤 이유에서인지 나는 그 해결책을 포기한다.어쨌든 -

• 나는 "ref"를 바꿀 수 없다.
• 확장 동작 내부에서 게이터(또는 상태)에 도달할 수 없다.

나는 ref 대신 payload를 전달하고 bracket을 사용하지 않는다.

(({ bindFirebaseRef }, payload)

그럼 내가 모든 자료로 페이로드를 통과시킬 수 있어

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

그리고 그것을 행동으로 옮겨라.

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

어쩌면 파견을 어디로 부르느냐가 중요할 수도 있다

참조URL: https://stackoverflow.com/questions/50163065/how-to-query-with-vuexfire