Skip to content
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

in a computed: const variable = get("propertyName") returns a function instead of the object or the value. #113

Closed
Derasm opened this issue Sep 25, 2020 · 4 comments

Comments

@Derasm
Copy link

Derasm commented Sep 25, 2020

In computed i have a function Tasks which return an array.
using VueX:

Tasks() {
  const tasks = this.$store.getters.GetTasks;
  return tasks //this returns the array of Tasks as you would expect.
}

when i try to do the same using pathify:

const tasks = get("tasks") 
return tasks // this returns 'function getOne()' and nothing else. 

However, if i do this:

Tasks: get("tasks") // this works as expected. 

is there something i am missing here, or is it not supposed to be possible to use Get method within a function?

Updated!
Apparently i needed to do this.$store.get instead. So i am guessing in Computed Properties the

get("something") 

becomes shorthand for

this.$store.get("something")
@davestewart
Copy link
Owner

Hey,

(I updated your formatting - you might want to follow that format in the future!)

Sorry it's a bit confusing first time, but:

  • there is the computed property getter helper import { get } from 'vuex-pathify', and
  • the augmented store with $store.get() and $store.set()

If you want to get a value from the store for use in a calculation, use the method on the store.

If you want to wire a value from the store as a computed property, use the helper.

Is that clear?

@Derasm
Copy link
Author

Derasm commented Sep 25, 2020

Hey Dave, and here i thought Github was super smart with their formatting :D I'll follow it in the future.
3 things then:

  1. It would be nice if the docs had a "this is what call corresponds to, this is what sync corresponds to, this is set, this is get" part. I know the get/set part is there, but i could see nothing about the Sync and the Call part.

  2. It would probably alleviate a bunch of confusion if the docs had an example of how to use it in a computed property ( as is done in the demos), and how to use it in a method, 'cause i could find literally nothing on this situation and it has taken me 2 days and 2 asked vuex vets to figure this out (embarrassingly enough).

  3. Thanks for the insanely fast response !

@davestewart
Copy link
Owner

davestewart commented Sep 25, 2020

FWIW, I find that in code you can treat getters as if they were state, so not much value in naming like methods:

// could do this...
const tasks = this.$store.getters.GetTasks;
// I think this is clearer
const tasks = this.$store.getters.tasks;

Pathify actually has something called "accessor priority" for this situation; if you name the state and the getter the same, it will choose the getter over the state:

const tasks = store.get('tasks') // automatically gets the getters

https://davestewart.github.io/vuex-pathify/#/api/properties?id=accessor-priority

@davestewart
Copy link
Owner

Yeah, the docs... they give too much info in parts, and perhaps don't get to the point quick enough in others.

I should have gone the API + Guide approach, but ended up doing a kind of "combined" approach which isn't great when you just want to see what the API is!

Unfortunately, I have never had the time to go back and redo them. Was thinking about doing them in VuePress... but you know... life!

You are welcome to always ask questions here, and I will do my best to answer them 😃

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

No branches or pull requests

2 participants