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

types(useRoute): add generic for params #1159

Closed
wants to merge 1 commit into from

Conversation

fyapy
Copy link

@fyapy fyapy commented Oct 16, 2021

Version

4.0.12

Steps to reproduce

Pass params to function with typed arguments

image

Error message
Argument of type 'string | string[]' is not assignable to parameter of type 'string'.
Type 'string[]' is not assignable to type 'string'.

What is expected?

Possability to pass generic for params types, like in react-router-dom hook useParams
https://github.com/DefinitelyTyped/DefinitelyTyped/blob/09ce5bbfc2d507d35f6e8185a1f6a617bfca20fc/types/reach__router/index.d.ts#L182

How will it look like

type Params = {
id: string
type: ResourceType
}
const route = useRoute<Params>()

@fyapy fyapy marked this pull request as draft October 16, 2021 22:33
@fyapy fyapy marked this pull request as ready for review October 16, 2021 22:33
@n0099
Copy link

n0099 commented Feb 28, 2022

LGTM

@posva
Copy link
Member

posva commented Mar 1, 2022

Thank you for this. Let's not add new generics yet because then it won't be possible to adapt without a new major release and a breaking change 😉 .

For the moment, the best solution is to have a user-defined useParams() like mentioned at #1160 (comment) that overrides the types for params. Something like:

import { RouteParams } from 'vue-router'
import { computed } from 'vue'

function useParams<P extends RouteParams>() {
  const route = useRoute()
  return computed(
    () => route.params as P
  )
}

@posva posva closed this Mar 1, 2022
@saidinusah
Copy link

@posva , hi any news on this? I'm interested in finalising this so it can be supported in nuxt3

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

Successfully merging this pull request may close these issues.

4 participants