CODEWITHSUNDEEP
firebasevue.jsjoin
swasher
swasher

Reputation: 391

How join two Vuefire collection?

I have two queries in Vue.js with Firebase (vuefire). This queries have similar datas. I want somehow join it, for later iterate.

watch: {
    searchQuery: {
        handler(searchQuery) {
            if (searchQuery) {
                this.$bind('logos1', logosCollection
                    .where('tags', 'array-contains-any', [this.searchQuery]))
                this.$bind('logos2', logosCollection
                    .where("name", '>=', this.searchQuery)
                    .where("name", '<=', this.searchQuery+'\uf8ff')
                    .orderBy('name')
                );
                this.logos= ====> SOMEHOW LOGOS1+LOGOS2
            }
        }
    },

Is there any method to do this?

Upvotes: 0

Views: 190

Answers (1)

sanx
sanx

Reputation: 93

I've built a little helper for that using $watch.

export function bindCombineArrays(that, combined, props, sort) {
  console.log(`bindCombineArrays "${combined}" <== ${props}`);
  let combine = () => {
    let arr = props.reduce((res, p) => res.concat(that[p]), []);
    if (sort)
      arr = sort(arr);
    console.log(`refreshing combined "${combined}" =`, arr);
    that.$set(that, combined, arr);
  };
  // watches each property
  props.forEach((p) => { that.$watch(p, combine); });
}

Example:

    this.$bind("convA", db.collection(`conversations`).where("u1.id", "==", this.eventUser.id));
    this.$bind("convB", db.collection(`conversations`).where("u2.id", "==", this.eventUser.id));
    bindCombineArrays(this, "conversations", ["convA", "convB"]);

Upvotes: 1

Related Questions