类型'CanvasRenderingContext2D | WebGLRenderingContext' 不可分配给类型 'CanvasRenderingContext2D'

Question

我已使用 Typescript 1.5 Beta 升级到 Visual Studio 2015 Community。我收到以下错误。

键入'CanvasRenderingContext2D | WebGLRenderingContext' 不是 可分配给类型“CanvasRenderingContext2D”

这发生在下面一行

var canvas: HTMLCanvasElement = $(element).find('canvas').get(0);
var ctx: CanvasRenderingContext2D = canvas.getContext("2d");

我已将 TypeScript 工具版本设置为 1.4 和 1.5 并得到相同的错误。

Answer 1

从错误消息中，getContext 的返回类型似乎是联合类型，这意味着它是 CanvasRenderingContext2D 或 WebGLRenderingContext 之一。

编译器不知道是哪个，所以你需要帮助它：

var ctx = <CanvasRenderingContext2D> canvas.getContext("2d");

但是，如果我尝试使用最新版本的所有内容，则效果很好：

var canvas = <HTMLCanvasElement> $('#example').find('canvas').get(0);
var ctx: CanvasRenderingContext2D = canvas.getContext("2d");

所以看起来有些不对劲。

getContext 的当前定义具有值“2d”的专用签名，应该会返回一个CanvasRenderingContext2D。这是三个签名...

1. “2d”：CanvasRenderingContext2D
2. “实验-webgl”：WebGLRenderingContext
3. 其他string：CanvasRenderingContext2D | WebGLRenderingContext

如果它不能识别传入的字符串，它应该只返回联合类型。

如果当您在getContext 之后键入( 时，自动完成没有提示这三个重载，则可能表明存在问题。