如果指定了类型,则无法在 typescript 中调用 setter 函数

爱德华多·杜特拉

我正在开发一个前端项目,现在我在注册表单中,我为用户导出了以下类:

export class User {

    private _id: string
    private _name: string
    private _last_name: string
    private _email: string
    private _age: number
    private _password: string

    constructor(id: string, name: string, lastName: string, email: string, age: number, password: string) {
        this._id = id
        this._name = name
        this._last_name = lastName
        this._email = email
        this._age = age
        this._password = password
    }

    static emptyUser() {
        return new User('', '', '', '', 0, '')
    }

    public get id() : string {
        return this._id
    }

    public set id(id:string) {
        this._id = id
    }
    
    public get name() : string {
        return this._name
    }

    public set name(name:string) {
        this._name = name
    }

    public get lastName() : string {
        return this._last_name
    }

    public set lastName(lastName:string) {
        this._last_name = lastName
    }
    
    public get email() : string {
        return this._email
    }

    public set email(email:string) {
        this._email = email
    }
    
    public get age() : number {
        return this._age
    }

    public set age(age:number) {
        this._age = age
    }
    
    public get password() : string {
        return this._password
    }

    public set password(password:string) {
        this._password = password
    }
}

然后,每当我在组件中调用 setter 函数时,vscode 都会由于“String”类型没有签名而签署错误。但是,如果我将 setter 参数类型更改为“任何”,错误就会消失。组件代码如下:

import { useState } from "react"
import { User } from "../../../core/User"
import AuthenticationButton from "../AuthenticationButton"
import AuthenticationInput from "../AuthenticationInput"

function SignUpForm() {

    const [clientSignUp, setClientSignUp] = useState<User>(User.emptyUser())

    function setClientName(name:string) {
        setClientSignUp(clientSignUp.name(name))
    }

    return (
        <div className="flex flex-col gap-3
                        text-xl">
            <h1 className="text-3xl">Sign Up</h1>
            <hr className="bg-gray-900 border border-gray-900" />
            <label htmlFor="SignUpName">Name:</label>
            <AuthenticationInput
                inputId="SignUpName"
                inputType="text"
            />
            <label htmlFor="SignUpLastName">Last name:</label>
            <AuthenticationInput
                inputId="SignUpLastName"
                inputType="text"
            />
            <label htmlFor="SignUpEmail">E-mail:</label>
            <AuthenticationInput
                inputId="SignUpEmail"
                inputType="email"
            />
            <label htmlFor="SignUpPassword">Password:</label>
            <AuthenticationInput
                inputId="SignUpPassword"
                inputType="password"
            />
            <div className="flex justify-center">
                <AuthenticationButton>Sign up</AuthenticationButton>
            </div>
        </div>
    )
}

export default SignUpForm
双H

你使用setter错误的方式。更新你setClientName

function setClientName(name: string) {
    clientSignUp.name = name;
    setClientSignUp(clientSignUp);
}

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Sequelize Typescript Sequelize Typescript TypeError:如果没有“ new”,则无法调用类构造函数模型

调用对象函数(如果它存在于TypeScript中)

在TypeScript中调用泛型类型的构造函数

在 Typescript 中调用 Readonly 函数

尽管关联的getter可以工作,但对Typescript setter的调用不会返回函数

如果属性成员是函数类型,如何在 Typescript 中动态调用

在Javascript函数中调用Typescript函数

如果存在 sql 记录,则无法调用 php 函数

getter和setter中Observable的Typescript返回类型

为什么我的getter / setter无法在TypeScript中编译?

找出TypeScript中的函数类型

TypeScript中函数的类型防护

在TypeScript中将动态的getter / setter属性添加到函数中

如果没有Android Kotlin mvvm中的主要构造函数,则无法进行超级类型初始化

在TypeScript中调用NPM模块的JS函数

从Highcharts加载事件中调用Typescript函数

无法从Ionic2中的移相器事件中调用外部Typescript函数

从TypeScript调用JavaScript函数

如何调用 Typescript 函数?

在TypeScript中,当调用函数时,为什么可以提示null参数具有其他类型?

是否可以设置函数的通用类型而无需在Typescript中调用它?

在Typescript中调用超级构造函数后,无法从子类实例访问属性

TypeScript中模块上的getter / setter

没有类的Typescript中的Getter / Setter

在Typescript中对类的构造函数的类型引用?

TypeScript 中的类型级 Catalan 函数

TypeScript中的抽象构造函数类型

如何从Typescript中的函数获取参数类型

TypeScript箭头函数中参数的类型