Reputation: 33635
I currently have an object similar to the following in a Vue.js app that I'm trying to port over to TypeScript. Note this object's structure is dictated by the Vuex library:
const getters = {
allUsers(state) {
return state.users;
},
firstUser(_state, getters) {
return getters.allUsers()[0]
}
}
How can I provide the appropriate type for getters here in firstUser
?
const getters = {
allUsers(state: State) {
return state.users;
},
firstUser(_state: State, getters: typeof getters) {
return getters.allUsers()[0]
}
}
Currently I get the following error:
[ts] 'getters' is referenced directly or indirectly in its own type annotation.
Update: @basarat determined you can make that error go away by renaming the argument.
const getters = {
allUsers(state: State) {
return state.users;
},
firstUser(_state: State, theGetters: typeof getters) {
return theGetters.allUsers()[0]
}
}
However, typeof getters
ends up being any
rather than the type of the getters
object.
Upvotes: 3
Views: 1579
Reputation: 330571
I really can't understand why you need getters
to act this way, but I'll presume you know what you're doing.
This is a limitation of the TypeScript compiler: it will realize that the type of getters
is recursive, and gives it an any
type. The only way around this is to have a type name for getters
and use it. How about a class?
class Getters {
allUsers(state: State) {
return state.users;
}
firstUser(_state: State, theGetters: Getters) {
return theGetters.allUsers()[0]; // hey, a bug!
}
}
const getters = new Getters();
This now is properly typed, and even shows you a bug in your implementation of firstUser
(which you fix by, I guess, passing _state
into allUsers()
).
Hope that helps. Good luck.
Upvotes: 2
Reputation: 276393
[ts] 'getters' is referenced directly or indirectly in its own type annotation.
There are two getters in scope. The parameter and the variable. Change one.
const getters = {
allUsers(state: State) {
return state.users;
},
firstUser(_state: State, _getters: typeof getters) { // Rename
return _getters.allUsers()[0]
}
}
There are other errors, but this is the one you are asked help for.
Upvotes: 2