[英]TypeScript: Tagged Template Literals shows Error
我正在尝试将 ES5 的标记模板文字与打字稿一起使用,但似乎打字稿没有完全支持它。 我有以下一段代码。
class TemplateLiterals {
age: number = 24;
name: 'Luke Skywalker'
private tag(strings: string[], personExp, ageExp) :string{
var str0 = strings[0]; // "that "
var str1 = strings[1]; // " is a "
var ageStr;
if (ageExp > 99) {
ageStr = 'centenarian';
} else {
ageStr = 'youngster';
}
return str0 + personExp + str1 + ageStr;
}
toString() {
return this.tag `that ${ this.name } is a ${ this.age }`;
}
}
在toString
方法中,打字稿显示以下错误。
Argument of type 'TemplateStringsArray' is not assignable to parameter of type 'string[]'.
Property 'push' is missing in type 'TemplateStringsArray'.
我不知道为什么它向我显示此错误。 根据 mozilla 的文档“标签函数的第一个参数包含一个字符串值数组。” 所以它应该接受字符串数组。 但实际的期望是TemplateStringsArray
。 不确定如何以及何时定义interface
TemplateSringsArray
。 目前我使用TemplateSringsArray
类型来避免这个错误。 任何人都可以请解释发生了什么。 谢谢。 这里是操场。
经过更多探索,我终于在更改日志中找到了解释。 希望它会帮助某人。 它说
ES2015标记模板总是将它们的标记传递给一个不可变的类数组对象,该对象具有一个名为raw的属性(也是不可变的)。 TypeScript将此对象命名为TemplateStringsArray。
方便的是,TemplateStringsArray可以分配给一个数组,因此用户可以利用它来为其标记参数使用更短的类型:
function myTemplateTag(strs: string[]) {
// ...
}
但是,在TypeScript 2.0中,该语言现在支持readonly修饰符,并且可以表示这些对象是不可变的。 因此,TemplateStringsArray也已变为不可变,并且不再可分配给string []。
建议:
显式使用TemplateStringsArray
(或使用ReadonlyArray<string>
)。
我也找不到任何关于TemplateStringsArray
文档 - 但如果你只是通过将参数更改为TemplateStringsArray
而不是string[]
来忽略错误(并修复名称成员的错误)它似乎工作正常
class TemplateLiterals {
age: number = 24;
name: string = 'Luke Skywalker'
private tag(strings: TemplateStringsArray, personExp, ageExp) :string{
var str0 = strings[0]; // "that "
var str1 = strings[1]; // " is a "
var ageStr;
if (ageExp > 99) {
ageStr = 'centenarian';
} else {
ageStr = 'youngster';
}
return str0 + personExp + str1 + ageStr;
}
toString() {
return this.tag `that ${ this.name } is a ${ this.age }`;
}
}
var luke: TemplateLiterals = new TemplateLiterals()
console.log(luke.toString())
上面的答案对我不起作用,也许要求从现在开始(2021 年 12 月)已经改变。
但是我能够使用ReadonlyArray<string>
而不是string[]
来解决我的问题。
这是我的示例函数,以防万一这对某人有帮助。
function myTemplateTag(strs: ReadonlyArray<string>) {
// Do something.
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.