Vue.extend

1.傳遞的參數

Vue.extend({Object})，傳遞的是一個對象，這個對象包含template等，其實就是傳遞一個包含組件選項的對象。

他是屬于Vue的全局API，用來創建一個Vue的"子類"。

2.使用

2.1 直接用來掛載元素

Vue.extend({Object})放回的是一個構造器，data要寫成組件的函數形式，因為創建的是構造器，并非實例，所以要使用這個組件就必須new出來，并通過KaTeX parse error: Expected 'EOF', got '#' at position 8: mount('#?mount-point')進行…mount()等同于el屬性。

// 創建構造器 var Profile = Vue.extend({template: '<p>{{firstName}} {{lastName}}</p>',data: function () {return {firstName: 'Wang',lastName: 'wu',}} }) // 創建 Profile 實例，并掛載到一個元素上。 new Profile().$mount('#mount-point')//結果： //<div id="mount-point"></div> //<p>Walter White aka Heisenberg</p>

2.2 或者用來創建組件

//創建Vue對象 var vue = new Vue({el:'mount-point' })// 創建構造器 var Profile = Vue.extend({template: '<p>{{firstName}} {{lastName}}</p>',data: function () {return {firstName: 'Wang',lastName: 'wu',}} })//也可以這樣使用，通過傳入構造器和指定組件名'my-component'，注冊一個全局組件 Vue.component('my-component', Profile)//結果：我就可以在vue實例掛載的元素中，使用我的組件了 //<div id="mount-point"><my-component></my-component></div>

總結

以上是生活随笔為你收集整理的Vue.extend的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。