为什么 Ref 尝试访问字段而不是 getters setters

Question

我 class 是这样的：（我正在使用 ts）

class FooClass
 {
    private _Id:number=0 ; 
    private _PrCode: number =0; 

    public get Id(): number {
        return this._Id;
    }

    public set Id(id: number) {
        this._Idproduit = id;
    }

    public get PrCode(): number {
        return this._PrCode;
    }

    public set PrCode(prCode: number) {
      
       this._PrCode = prCode;
    }
 }

如果像这样创建一个反应变量，则在组件内部：

 const Model = ref<FooClass|null>(null);

当我想将它传递给函数时说：

let FooFunc  = (FooClass|null) =>{//Do something}

像这样：FooFunct(Model) 我得到这个错误

Argument of type '{ Id: number; PrCode: number; }is not assignable to parameter of type 'FooClass'. type { Id: number; PrCode: number; } is missing the following properties from type 'FooClass': {_Id,_PrCode}

这就像 Ref 函数尝试访问“私有字段”而不是 getters/setters 我该如何解决这个问题？

Answer 1

这是不会在运行时发生的 TypeScript 错误，因此它与实际访问的私有字段无关。

私有字段会影响 TypeScript 中的类型兼容性。这可用于强制不兼容并防止类型与相似类型意外匹配。这里需要做相反的事情，私有字段需要从类型中排除。

应该是：

type FooInterface = Pick<FooClass, keyof FooClass>
...
const Model = ref<FooInterface|null>(null);
let FooFunc  = (FooInterface|null) =>{//Do something}

为什么 Ref 尝试访问字段而不是 getters setters

why Ref try to acces fields instead of getters setters

typescript

vue.js

vuejs3