打字稿错误类型"null"不可分配给类型

Question

在我的项目中，我使用AngularLocalStorage来存储文件名类型的记录的值。我在back方法中得到以下错误

错误

Type 'string | null' is not assignable to type 'FileName | undefined'.
Type 'null' is not assignable to type 'FileName | undefined'.

我需要帮助来解决这个错误，下面是我的代码

代码

export interface FileName {
fname: number;
sname: number;
Tange: number;
quick: string;
Mark: string;
mine: number;
}
currentName: FileName | undefined = undefined;
previousName: FileName | undefined = undefined;
data(rec: FileName, Mark: HTMLTableDataCellElement) {
const { fname, sname, Tange, record_id, mine } = rec;
const quick = Mark.innerText;
this.name.replaceAndNew({sname, Tange, record_id, quick, mine, fname}).subscribe(data => {
this.process(data);
})
localStorage.setItem('FileName', JSON.stringify(rec));
}
back(){
localStorage.getItem('FileName');
this.currentName =  localStorage.getItem('FileName'); -----------------> Error
}

Answer 1

fortunee是正确的，但是由于localStorage中的所有内容都存储为字符串，Typescript无法保证对象仍然是同一个对象。在这种情况下，您需要告诉Typescript解析后的对象将是什么类型的强制转换。

this.currentName =  JSON.parse(localStorage.getItem('FileName') || '{}') as FileName;

之后，您可能需要回避类型以确保this.currentName不是一个空对象(如果用户清除了其localStorage，则可能会发生这种情况(。

示例：

if (this.currentName.fname == null) {
// Give the user an error message or something...
this.currentName = undefined;
}

Answer 2

如果在解析对象时出错，可以使用try-catch为其设置的默认值

try {
this.currentName =  JSON.parse(localStorage.getItem('FileName')) as FileName;
} catch(e){
this.currentName = {}
}

Answer 3

您需要使用JSON.parse将其解析回对象

this.currentName =  JSON.parse(localStorage.getItem('FileName'));

Answer 4

我遇到了同样的错误，只是通过修复了它

const currentName =  String(localStorage.getItem('FileName') || '');