Vuefire: Querying with params from $route

[FranzSkuffka]

I came to realise that if I pass a function to firebase like I would pass to data in one of my
components, it does not get called. I want to pass a route parameter to my query innovation.

# editor.vue
  firebase: ->
    console.log 'evaluating' # not logging
    data = 
      innovation: db.innovation @$route.params.innovation_slug

# alternative editor.vue: this is effectively binding innovation to the data source
  firebase:
    innovation: db.innovations() # query working, but route not available

# db.coffee
module.exports = ->
  url = 'project-2654865812003744343.firebaseio.com'

  firebase =
    innovation: (slug) =>
      ref = new Firebase url
      ref.child('innovations').orderByChild('name').equalTo(slug)

    innovations: =>
      ref = new Firebase url
      ref.child 'innovations'

  return firebase

I also tried binding the data sources in the ready hook.

# editor.vue
  ready: ->
    @$bindAsObject('innovation', db.innovation(@$route.params.innovation_slug)) # not binding

Am I doing something wrong? Do you have a recommended approach or a working example?

[FranzSkuffka]

I managed binding it.

[jwngr]

Sounds like you resolved this problem. If you did, please provide the solution you ended up with so that future devs can benefit from your answer.

[FranzSkuffka]

Here's my solution.
https://github.com/FranzSkuffka/innovant/blob/firebase-wip/assets/libs/vuefire.js#L177

It's just a hacky quickfix, but that's where the change is needed. Possibly you want to incorporate it in a different way.

Here is how it is used:
https://github.com/FranzSkuffka/innovant/blob/firebase-wip/app/components/editor.vue#L58

I will have to make sure that it does not interact with the other problems I opened issues for.

[FranzSkuffka]

Should I file a PR?

[balthild]

Same issue.

export default {
    firebase: {
        articles: db.ref('/data/article').orderByChild('id').equalTo(this.$route.params.id)
        // Uncaught TypeError: Cannot read property '$route' of undefined
    }
}

I hope that there will be a official fix because I'm using npm.

[FranzSkuffka]

@balthild how does using npm relate to incorporating a fix?
You can just extract the file from your package.json and save it somewhere else...

@jwngr this is not a question, but bug I think.
Are you planning to fix this?

[posva]

@FranzSkuffka #25 adds this. I'll merge it this week and release a new version with the feature 😄

[FranzSkuffka]

@posva thanks very much for the heads up :)

[balthild]

@FranzSkuffka Well, I just want to keep all dependencies managed by npm exclusively...

@posva Thanks!