后缀名：.vue，该文件需要被预编译后才能在浏览器中使用注意：单文件组件依赖于两个包 vue-loader / vue-template-compiler安装：npm i -D vue-loader vue-template-compiler<!-- App.vue 示例代码： --><template><div><h1>VUE 单文件组件示例 -- App.vue</h1>

默认情况下，路由的导航菜单，会自动给当前菜单添加router-link-exact-active 和router-link-active 类。我们可以通过 linkActiveClass 来修改 router-link-active 这个类名，在路由规则配置中添加配置项linkActiveClass: ‘mui-active’，通过’mui-active’来自定义控制菜单栏切换样式

说明：vm.$refs 一个对象，持有已注册过 ref 的所有子组件（或HTML元素）使用：在 HTML元素 中，添加ref属性，然后在JS中通过vm.$refs.属性来获取注意：如果获取的是一个子组件，那么通过ref就能获取到子组件中的data和methods添加ref属性<div id="app"><h1 ref="h1Ele">这是H1</h1><hello ref=