Error: "Argument of type 'string | string' is not assignable to argument of type 'string'"

Question

I am developing a Vue project using both TypeScript and axios to make API calls and develop a reset password component, the resetPassword function in my auth.ts file looks like this

resetPassword(password1: string, password2: string, uid: string, token: string): Promise<any> {
      
      return new Promise<any>((resolve, reject) => {
        axios
            .post("API", { password1, password2, uid, token })
            .then((res : any) => {
              resolve(//RESOLVE);
            })
            .catch((error) => {
              //REJECT
            })
      })
    }

In my ResetPassword.vue file I use newPassword like this

this.resetPassword(password1.value, password2.value, this.$route.params.id, this.$route.params.resetID).then(
      (res) => {
        if(password1.value == password2.value){
            Notification{
                "SUCCESS"
            });
          }

In my ResetPassword.vue file, I get an error on the third parameter saying "Type 'string[]' is not assignable to type 'string'."

;

I'm a little new to ts and I need some help.

I'm confused between the two solutions here, should I have this.$route.params.id as a string or is this better this.$ Route.params.id.toString()

Answer 1

Route parameters can contain many values ​​with the same key. That's why it's probably an array of strings and not a single string. If you are sure there is only one parameter, you can use as string to tell the typescript compiler that you know 100% that this variable is a string and not a string[]代码>

this.resetPassword(password1.value, password2.value, this.$route.params.id as string, this.$route.params.resetID as string)

If you would use .toString() and would have an array like ["foo", "bar"] you would get "foo , bar" as the result of .toString()

If you are not sure whether it is an array, you can check it. If it is an array, take the first value:

let id: string;
if (Array.isArray(this.$route.params.id)) {
    id = this.$route.params.id[0];
} else {
    id = this.$route.params.id;
}