如题。例如如下代码使用Vue.js装饰器进行编写,期望从id为`the-canvas`的`<canvas>`元素里拿到 `context`;代码编辑器为VSCode
import { Vue, Component } from 'vue-property-decorator'
@Component
export default class BizPage extends Vue {
private canvasCtx: CanvasRenderingContext2D | null = null
private async setCanvasCtx() {
const canvasEl = document.querySelector('#the-canvas') as HTMLCanvasElement
const width = canvasEl.width
const height = canvasEl.height
const canvasDomNode = await canvasEl?.$$prepare() as HTMLCanvasElement
const ctx = canvasDomNode.getContext('2d') as CanvasRenderingContext2D
const dpr = wx.getSystemInfoSync().pixelRatio //获取设备像素比
canvasEl.width = width * dpr
canvasEl.height = height * dpr
ctx.scale(dpr, dpr)
this.canvasCtx = ctx
console.log(this.canvasCtx)
}
}
代码编写过程中,`canvasEl?.$$prepare()` Typescript会报错,提示:“Property '$$prepare' does not exist on type 'HTMLCanvasElement'.”,但实际可正常运行。
因此,在这里,canvasEl的类型应当是什么?kbone中对此有没有对应的Typescript定义?

看了github代码
https://github.com/Tencent/kbone/blob/73d96c56cd27c1d0adb4ad03e4140d41da29d5fa/packages/miniprogram-render/src/node/element/canvas.js
kbone就没有用ts,你这边自己声明一个interface继承HTMLCanvasElement类型,再把要用的$$prepare补充到自己声明的类型中去. ts报错不会影响实际代码运行,毕竟只是一个代码检验.不影响逻辑功能.