Provide doc about integrating in bigger projects

[posva]

As seen in #5 and other requests, it'll be great to get further guidance and best practices about how to use firebase with vuexfire

• Where to bind references (actions)
• Where should the actual bound called (where to dispatch actions)
• where to host references
• How to write tests

Feel free to share your thoughts on this about what you'll like to see

[arranf]

I'd love to know how to write unit tests!

[vershinin]

Hi, I am interested in first two rows. Also, I have a question. How can I use vuexfire with strict mode?
It looks like it is not possible. You can have a look here:
http://codepen.io/ivershinin/pen/oBmYXX

[posva]

Strict mode is supported on v2. for the v1 it needs a mutation to call the function here instead of directly calling the function

[vershinin]

@posva How stable is v2 for production use?

[posva]

The internals are stable, it's really simple after all. The API will change in the future to make things easier, but we're still discussing the changes needed to Vuex to make that possible. If you use it today, you'll have to compile it by yourself and when the stable version is released, adapt to the API, which should be easy. Also, there're no docs other than the examples and unit tests. But it's really easy 🙂 , other people got it working already

[scharinger]

Is vuexfire compatible with vue-router? I'm trying to use it with vue-router and have an issue. I load an array from firebase with 'db.ref('listOfObjects')' which I use tie up with the component firebase property and mapGetters. Everything works fine, adding items to firebase with push also works. But if I navigate to another component using the a db.ref to the same source and then push an item to the db, the local collection gets the item added twice, but only in the local state and not in the firebase db. Is this a bug, me doing it wrong or simply vuexfire not compatible with vue-router?

EDIT: I now see the VUEXFIRE/arrayAdd is fired twice.

[chrisbraddock]

It works fine in my experience. Not sure what issue you're experiencing specifically but check out Vuex router sync if you haven't already.

[posva]

Is vuexfire compatible with vue-router?

Of course 😄

If you have two items added you probably bound a ref twice, but who knows, it may be a bug. In that case, boil down the issue in a jsfiddle and create a new issue 🙂

[scharinger]

I've tried to make sure the refs only binds once as I suspected it. Then I've also wrapped <router-view> in a <keep-alive> element. I'll hope to get time in the weekend to make a jsfiddle of it. Until then its possible to witness the bug here.

[scharinger]

An example using vuex, vue-router, keep-alive and a ref on multiple components would be helpful.

[posva]

@Tim86 The Where to bind ref examples will probably clear things out for you