vue.js - 如何在 Visual Studio Code 中自动完成 Vue 模板

Question

我开始使用 Visual Studio Code 学习 Vue。我下载了一个添加 Vue 代码片段的扩展程序(hallowtree 的 Vue 2 Snippets)。

当我开始输入 "v"在 Vue 模板中，显示了建议( v-on 、 v-bind 等)，
但之后，不会显示任何建议或自动完成。

在以下示例模板中，v-on建议，但之后，没有建议 "click"或任何其他事件。此外，在 "@" 之后没有任何提示:

<button v-on:click="changeLink">Click to change Link</button>
<button @click="changeLink">Click to change Link</button>

在这个例子中， v-bind建议，但之后，没有建议 "href"或任何其他 HTML 属性/属性:

<a v-bind:href="link">Link</a> 
<a :href="link">Link</a>

虽然对我修炼有好处，但会成为一种负担。
是否可以设置任何扩展、选项或命令来改善开发人员体验？

Answer 1

Vetur 已经有了 experimental template interpolation用于自 2019 年 2 月以来 HTML 模板中的自动完成和“诊断/悬停/定义/引用”。

启用 Vetur › Experimental: Template Interpolation Service VS Code 设置中的选项以打开此功能。