Comments (3)
That behaviour is intended. The computed property reacts first to the empty array then firebases fetches data and updates the array again. Nothing to worry about 😉
from vuefire.
This is a solution I implemented for what I think to be a similar challenge. ... may or may not be helpful Cheers --
<v-data-table
class="ma-3"
:disable-sort="true"
:footer-props="{
itemsPerPageOptions: [5, 10, 25, 100]
}"
:headers="headers"
:loading="loadingChanges"
:items="tableOptions.records"
:items-per-page="tableOptions.per_page"
:options="tableOptions"
:server-items-length="tableOptions.total_records"
:search="tableOptions.search"
@update:options="onTableOptionsUpdate($event)"
>
methods: {
...
onTableOptionsUpdate: _.debounce(function (newTableOptions) {
/*
* Why? Cuz otherwise everything runs twice.
*
* Again you ask Why?
*
* Our TableOptions are instantiated in the store with defaults.
* On Load we make a call that hydrates the tableOptions... Good
*
* But
*
* That is an update to tableOptions (even if it is the same values) which fires the
* @update:options event, which in turn goes out to the API again with the same values as onLoad... BAD
*/
if (this.apiCallCount === 0) {
this.getLienholderAddresses(transformedTableOptions);
this.apiCallCount++;
} else {
this.apiCallCount = 0;
}
from vuefire.
I know this is a closed issue but I faced the same issue in my app. Here is my solution.
If I take the initial example, I was watching the subscriptions
data to stop my loader.
It turned out that it was called twice when I was calling this.$bind('subscriptions', ...)
.
The first call returned an empty array, the second call, the collection. Oddly, the second call might not occur if my collection was really empty.
Anyway, the trick is to use .then(subscriptions => { /* stop my loader */ }
when I do the binding. The promise will be called once anytime.
from vuefire.
Related Issues (20)
- Cannot read properties of null (reading 'photoURL') HOT 4
- Unbind `useCollection` on logout
- Realtime Database does not allow `null` despite docs? HOT 1
- Documentation of useCurrentUser
- Session Cookie Options
- Firebase Auth tree shaking HOT 3
- GOOGLE_APPLICATION_CREDENTIAL alternative for monorepos HOT 8
- Make vue-fire compatible with Ionic ? HOT 10
- Broken: "firebase.json" file doesn't exist + import issue HOT 5
- documentation error HOT 1
- id field value is override by vuefire HOT 3
- typescript type definition not consistence: useDocument return null reference if document does not exist HOT 1
- Error when installing v3.1.20. - simple-git-hooks not recognized as a command HOT 6
- `databaseDefaultSerializer` exported incorrecly HOT 1
- Use multiple firestore databases HOT 1
- When using withConverter on collection it do not fetch inner refs
- returned values from `useDocument` and `useCollection` using a getter aren't reactive HOT 1
- `toFirestore` inside `globalFirestoreOptions.converter` is never called HOT 1
- Detect nested refs in custom classes
- ssrKey: false not working in useDocument HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vuefire.