如何在模板中标注类型？
How to annotate types in the template?
<template>
Parameter 'el' implicitly has an 'any' type. -->
<v-table :ref="el => (table.ref = el)"></v-table>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
export default defineComponent({
setup() {
return {
table: ref({
ref: null,
}),
}
},
})
</script>
似乎模板中的 TypeScript 支持尚不可用，引用 Vue 作者 Evan You 的话：
This is technically doable:
- We use
@babel/parser to parse inline expressions, which already comes with TypeScript support for free. I tested by adding typescript to the parser plugin list and your example compiles just fine.
- We need to add a pass to strip type annotations, which can be done with
esbuild so that will still be reasonably fast.
Obviously this won't work for the in-browser build, but runtime and build-time compilations already have different levels of support.
Still, I'll need to play with this and @vuedx to see whether the benefit justifies the extra cost.
<template>
Parameter 'el' implicitly has an 'any' type. -->
<v-table :ref="el => (table.ref = el)"></v-table>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue'
export default defineComponent({
setup() {
return {
table: ref({
ref: null,
}),
}
},
})
</script>
似乎模板中的 TypeScript 支持尚不可用，引用 Vue 作者 Evan You 的话：
This is technically doable:
- We use
@babel/parserto parse inline expressions, which already comes with TypeScript support for free. I tested by addingtypescriptto the parser plugin list and your example compiles just fine.- We need to add a pass to strip type annotations, which can be done with
esbuildso that will still be reasonably fast.Obviously this won't work for the in-browser build, but runtime and build-time compilations already have different levels of support.
Still, I'll need to play with this and
@vuedxto see whether the benefit justifies the extra cost.