VueFire - Manipulate firestore data before rendering

Question

I would like to manipulate the data before rendering. The following seems to render the data in realtime, which is ideal, however, I would like to group the returned data in very specific ways:

firestore() {
    const userId = firebase.auth().currentUser.uid;
    return {
      data: db.collection("users").doc(userId).collection("entries"),
    };
  },

Is there a way to manipulate the returned data before rendering? I would like to use some of the groupBy and sortBy features of lodash. I already have this working without VueFire, but I would like the realtime aspect of VueFire and just struggling a bit.

Answer 1

So the way I was able to manipulate the data was just using a method in a loop in the render view:

<template v-for="(day, key) in manipulateData(data)">

The method simply being added to the component:

export default {
  name: "landing-page",
  ...
  methods: {
    manipulateData(_data) {
      ...
    },
  },
};

The data is now working in real time.