木灵鱼儿
阅读:3022
关于ts 属性“xxx”没有初始化表达式,且未在构造函数中明确赋值的解决方案
ts默认要求class中声明的属性必须初始化,所以,如果存在没有被初始化的属性,就会报这个错误。
如果我们让他或者等于null,那么在调用属性的时候又会提示值可能为null,极度麻烦
class A {
data: { name: string } | null = null;
}
const a = new A();
console.log(a.data.name);
然后你又不得不搞个非空断言。
console.log((a.data!).name);
每次都这么写非常麻烦。
赋值方案
既然他要赋值那么我们就赋值
class A {
data: { name: string };
constructor(data: { name: string }) {
this.data = data;
}
}
const a = new A({name:"sss"});
console.log(a.data.name);
通过构造函数赋值也可以避免这个问题,这个可以解决一部分问题,但是不能解决全部。
tsconfig.json 方法
直接关闭ts的检测初始化的配置,打开tsconfig.json
;找到strictPropertyInitialization
,将其改为false即可,没有就手动加上。
{
"strictPropertyInitialization": false
}
单次忽略
如果你既不想在构造函数里赋值,也不想改变全局的配置,那么可以使用单次忽略配置
class A {
// @ts-ignore
name: string;
}
const a = new A();
console.log(a.name);
三种方案,根据使用情况使用即可
版权申明
本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。
相关推荐
正确使用vue3的ts类型声明
前言使用了ts最头疼的是什么,除了类型声明应该没有第二家了,那么在vue3中如何正确的声明ts类型,代表着我们踏出了认识vue3的第一步,这非常重要,所以为此水个文章,分享给有需要的人。Volar 插件一开始我对于Volar并没有太大的需要,因为一直使用的Vetur,而且这个插件刚出来时并不完善,各种视频up讲的那个一键分屏功能其实也并不好用,虽然是个很有意思的东西,但是没有那种非要使用它的点,所以当时的我怀着这么一个疑问?为什么要用Volar ?现在我就通过两张图告诉你,它有多香!我们在template里面写代码,绑定变量最烦的是什么,就是我们写了个对象,但是忘了它的属性有哪些啊,使用...

映射类型,对象属性批量设置约束
批量设置属性全部只读interface ObjInterface { a: number; b: number; c: number; } //全部设为只读 type readonlyObj = Readonly<ObjInterface>;鼠标移动到readonlyObj可以发现所有的属性全部设置为只读了。type readonlyObj = { readonly a: number; readonly b: number; readonly c: number; }我们按住ctrl+鼠标左键点击Readonly;可以看到...
索引类型,key的约束
再for循环中我们经常遇到类似这种写法const obj = { a: 1, b: 2, c: 3 }; //遍历obj拿到指定key对应的val数组 function getObjVal(obj:any,keys:string[]) { return keys.map(key => obj[key]); } console.log(getObjVal(obj, ["a", "b"])); console.log(getObjVal(obj, ["d", "e"]...