1.第一種,最常見.vue-cli模板就是這樣
import Vue from 'vue'
import App from './App'
new Vue({
????el: '#app',? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? //#app 元素的 outerHTML 是 Vue 模板紊遵,該模板可以被編譯成 render function许赃。
????template: '<App/>',
????components: { App }
})
2.第二種徙邻,這種掛載是直接掛載到入口文件index.html 的 id=app 的dom 元素上
new Vue({
????router,
????store,
}).$mount('#app')? ? ? ?
3.第三種礼烈,
new Vue({
????router,
????store,
????render: h => h(App)
}).$mount('#app')
4.第四種晦譬,
new Vue({
? ? ?el:'#app',??
?????router,??
? ? ?render: h =>h(App)
})
?5.第五種:
var options = {
????el: '#app',
? ? ?store,
? ? ?router,
? ? ?...App
};
new Vue(options)
$mount()用于手動掛載
當Vue實例沒有el屬性時歌亲,則該實例尚沒有掛載到某個dom中假如需要延遲掛載,可以在之后手動調(diào)用vm.$mount()方法掛載。
例如:newVue({router,render:h=>h(App)}).$mount("#app");
render: x => x(App)// 這里的render: x => x(App)是es6的寫法//?
轉(zhuǎn)換過來就是: 暫且可理解為是渲染App組件//?
render:(function(x){// return x(App);// });