错误：“‘string | string’类型的参数不可分配给‘string’类型的参数”

Question

我正在开发一个 Vue 项目，同时使用 TypeScript 和 axios 进行 API 调用，同时开发重置密码组件，我的 auth.ts 文件中的 resetPassword 函数如下所示

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
            })
      })
    }

在我的 ResetPassword.vue 文件中，我使用如下所示的 newPassword

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

在我的 ResetPassword.vue 文件中，第三个参数出现错误，提示“类型‘string[]’不可分配给类型‘string’。”

我对 ts 有点陌生，我需要一些帮助。

我对这里的两种解决方案感到困惑，我应该将 this.$route.params.id 作为字符串 还是这样做更好 this.$ Route.params.id.toString()

Answer 1

路由参数可以包含许多具有相同键的值。这就是为什么它可能是字符串数组而不是单个字符串。如果你确定只有一个参数，你可以使用 as string 来告诉打字稿编译器你知道这个变量 100% 是一个 string 而不是 <代码>字符串[]

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

如果您将使用 .toString() 并且会有一个像 ["foo", "bar"] 这样的数组，您将得到 "foo ,bar" 作为 .toString()

的结果

如果不确定是否是数组，可以检查一下，如果是数组则取第一个值：

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