两个 vue 组件仅加载一个
在 div 中同时包含两个 vue 组件时，有时会出现仅加载一个组件的情况。代码示例如下：
<div class="content">
<header-bar/>
<nav-bar/>
<script src="../assets/scripts/base.js"></script>
<script src="../assets/scripts/index.js"></script>
<script>
var vm = new vue({
el: ".content",
data: {}
})
</script>
</div>为了解决这个问题，需要将组件标签从自闭合标签（例如<header-bar/>）更改为非自闭合标签（例如<header-bar></header-bar>）。修改后的代码如下：
<div class="content">
<header-bar></header-bar>
<nav-bar></nav-bar>
<script src="../assets/scripts/base.js"></script>
<script src="../assets/scripts/index.js"></script>
<script>
var vm = new Vue({
el: ".content",
data: {}
})
</script>
</div>通过这些修改，两个组件现在可以同时加载了。
立即学习“前端免费学习笔记（深入）”；
