前面的話
前端日問，鞏固基礎，不打烊！！！每天花20分鐘鞏固，思考總結。
解答
我們所創建的實例都是通過new Vue()的形式創建出來的。在一些特殊情況下，我們要動態的去創建Vue實例，Vue提供了Vue.extend和$mount兩個方法來手動掛載一個實例。
Vue.extend(options)是基礎Vue構造器，創建一個“子類”，參數是一個包含組件選項的對象。
簡單舉例
<body>
<!-- <div id="users"></div> -->
<!-- 或者 -->
<users></users>
</body>
<script>
// 使用Vue.extend編寫一個擴展實例
var users = Vue.extend({
template: '<div> Hello:{{name}}</div>',
data: function() {
return {
name: 'xiaoqi'
}
}
});
// 手動掛載：
// new users().$mount('#users');
// 或者
new users().$mount('users');
</script>
如果Vue實例在實例化時沒有收到el選項，它就處於未掛載 狀態。我們可以手動使用$mount掛載一個未掛載的實例。
如果在html中對應兩種方法調用:
- 自定義標籤
- 普通標籤
使用propsData
// 使用Vue.extend編寫一個擴展實例
var users = Vue.extend({
template: '<p><a :href="url">{{author}} & {{name}}</a></p>',
props: ['name'],
data: function() {
return {
author: '作者：',
url: `https://blog.csdn.net/qq_41257129`
}
}
});
new users({propsData: {name:"xiaoqi"}}).$mount('users');
使用propsData可以傳遞數據。
