direct-vuex
direct-vuex copied to clipboard
Types stop working when returning a value from $store
Hello,
When I try to return a value from the store inside a computed function like this:
// doesn't work
computed: {
userFullName: function() {
return this.$store.direct.state.user.fullName;
^^^^^^
}
},
I get this error message:
TS2339: Property 'direct' does not exist on type '(() => any) | ComputedOptions<any>'.
Property 'direct' does not exist on type '() => any'.
However, if I first assign it to a variable and then return it, everything works fine:
// does work
computed: {
userFullName: function() {
const userFullName = this.$store.direct.state.user.fullName;
return userFullName;
}
},
I create that component with Vue.extend()
in case that is important.
Also, using your 2nd suggestion works fine:
import store from "./store"
export default Vue.extend({
...
computed: {
userFullName: function() {
return store.state.user.fullName;
}
},
});
But I don't want to have to import store
into every component that wants to access it.
Is this a bug or am I doing something wrong?
Btw, this is in Vue 2.16.
Thanks!
I just found out that if the component doesn't have a prop
object the typings work just fine. However, once there's a prop
object (even if it's empty) the error above shows up.