Skip to content

Querying with params from $route #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
janwirth opened this issue May 23, 2016 · 9 comments
Closed

Querying with params from $route #10

janwirth opened this issue May 23, 2016 · 9 comments
Labels

Comments

@janwirth
Copy link

janwirth commented May 23, 2016

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?

@janwirth
Copy link
Author

I managed binding it.

@jwngr
Copy link

jwngr commented May 23, 2016

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.

@jwngr jwngr closed this as completed May 23, 2016
@jwngr jwngr added the question label May 23, 2016
@janwirth
Copy link
Author

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.

@janwirth
Copy link
Author

Should I file a PR?

@balthild
Copy link

balthild commented Sep 8, 2016

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.

@janwirth
Copy link
Author

janwirth commented Sep 8, 2016

@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
Copy link
Member

posva commented Sep 8, 2016

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

@janwirth
Copy link
Author

janwirth commented Sep 8, 2016

@posva thanks very much for the heads up :)

@balthild
Copy link

balthild commented Sep 8, 2016

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

@posva Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants