我正在创建一个自定义的 Vue 组件，作为将 jQuery Select2 小部件应用于传统 HTMLselect元素的包装器。
一切正常，但Visual Studio抛出了一个关于我实现解决方案方式的语法警告：
<select2 v-on:change="change($event)">
<option></option>
<option v-for="(option, optionIndex) in options"
v-bind:key="optionIndex"
v-bind:value="option.value">{{option.text}}</option>
</select2>
每个option元素下方都有一条绿色波浪线，并带有以下注释：
元素"选项"不能嵌套在"span"中。
信息清晰易懂。option元素应该在select内部，但由于我使用的是自定义select2组件，Visual Studio变得混乱。
我遇到的问题是，我的自定义组件实际上只是select元素的包装器，因此它在技术上会产生适当的输出。
有没有办法强制Visual Studio忽略这种特殊情况，这样我的滚动条中就不会显示语法警告？
有没有另一种方法来实现这个组件，这样它就不会抱怨？
我想我也许可以为options添加另一个 prop 并传入一个数组以在组件内创建option节点，而不是通过插槽传递它们，但它变得复杂，因为我们有很多组件使用它与不同的选项属性来生成值和文本(即option.label和option.id而不是option.text和option.value(，所以看起来插槽最适合我们的需求。
我的另一个想法是创建一个select2option组件，它只是标准选项的包装器，但这似乎有些过分，我无法想象我们的其他开发人员会直观地使用这些超过标准option元素。
只是想知道Visual Studio是否可以在不完全关闭语法的情况下采取任何措施来纠正这种行为。
每个 DOM 模板解析注意事项，您应该能够做到
<select is="select2" v-on:change="change($event)">
<option></option>
<option v-for="(option, optionIndex) in options"
v-bind:key="optionIndex"
v-bind:value="option.value">{{option.text}}</option>
</select>
另请注意，正确的做法是在组件名称中使用连字符。