Vue vue.extend 和vue.component 兩則之間的區別

Vue.extend 返回的是一個 擴展實例構造器, 也就是一個預設了部分選項的Vue實例構造器html

Var myExtend  = Vue.extend({
      //預設選項     
})//返回一個 擴展實例構造器

//而後就能夠這樣來使用
var vE = new myExtend({
     //其它選項 
})

 

  Vue.component 是用來全局註冊組件的方法,其做用是將經過 Vue.extend 生成的擴展實例構造器註冊(命名)爲一個組件,能夠簡單理解爲當在模板中遇到該組件名稱做爲標籤的自定義元素時,會自動調用相似於 new myVue 這樣的構造函數來生成組件實例,並掛載到自定義元素上,固然實際狀況要比這複雜得多,還須要處理 props 數據傳遞、slot 內容分發、自定義事件、組件生命週期……事宜。vue

html:app

  <vE></vE>函數

此時頁面必然是沒有任何效果的,:spa

  擴展實例構造器還須要掛載:.net

              new eE().$mount('eE');code

https://www.jb51.net/article/118851.htmcomponent

extend 是構造一個組件的語法器。htm

你給它參數 他給你一個組件 而後這個組件能夠用到Vue.component 這個全局註冊方法裏,blog

也能夠在任意vue模板裏使用<componentname>組件

var apple = vue.extend({

  ...

})

Vue.component('componentname',componentname‘)

你能夠用到vue實例或者某個組件中的components 屬性中並在內容使用template-name

new Vue({

  components:{

    componentname:comontentname

  }

})

 

Vue.component你能夠建立,也能夠取組件

Sample:

    var component = Vue.component('componentname')

相關文章
相關標籤/搜索