没有内容 的组件应该在单文件组件 、字符串模板和 JSX 中自关闭,但在 DOM 模板中永远不要。
自关闭的组件传达出它们不仅没有内容,而且 意味着 没有内容。这是一本书中的空白页和标有“此页故意留空”的空白页之间的区别。 您的代码也更简洁,没有不必要的结束标记。
不幸的是,HTML 不允许自定义元素是自闭合的——只允许官方的 “void”元素 。这就是为什么只有当 Vue 的模板编译器可以在 DOM 之前到达模板,然后提供符合 DOM 规范的 HTML 时,该策略才有可能。
//坏
<!-- In Single-File Components, string templates, and JSX -->
<MyComponent></MyComponent>
<!-- In in-DOM templates -->
<my-component/>
//好
<!-- In Single-File Components, string templates, and JSX -->
<MyComponent/>
<!-- In in-DOM templates -->
<my-component></my-component>