javascript - 主脚本中的 Vuejs 模板限制

Question

在创建 Vue 应用程序时，我注意到 Vue 不允许这样的模板:

new Vue({
  template: `
    <div> 1 </div>
    <div> 2 </div>
    <div> 3 </div>
  `,

相反，它要求所有内容都包含在一个元素中，如下所示:

new Vue({
  template: `
    <div>
      <div> 1 </div>
      <div> 2 </div>
      <div> 3 </div>
    </div>
  `,

此限制不适用于子组件。

有办法解决吗？我不想为了取悦 Vue 而在标记中使用不必要的 DIV

Answer 1

因为在 Vue 中，模板中必须只有一个根元素:

https://v2.vuejs.org/v2/guide/components.html#A-Single-Root-Element

如果您需要解决方法，可以使用此插件:

https://www.npmjs.com/package/vue-fragments