1. 根实例 template 和 组件 template 是一样的,都只能有一个根元素(根元素指的是包含在最外层的元素);
new Vue({
el: '#app',
store,
components: {App, zujian}, //注册这两个组件
template: '<zujian></zujian>'
})
2. 优先级:根实例 template 内容 > 根实例绑定的元素的内容:
当根实例中的 template 有内容时(自定义模板或者直接放组件)时,网页会使用template 的内容,根实例绑定的元素的内容会被template的内容覆盖掉
当没有设置根实例的template内容时,Vue才会使用根实例绑定的元素的内容
例1:设置根实例的template
main.js
import Vue from 'vue'
import App from './App'
import zujian from './components/zujian'
import store from './store'
Vue.config.productionTip = false
new Vue({
el: '#app',
store,
components: {App, zujian},
template: '<zujian></zujian>'
})
项目的index.