vue.extend與vue.component的區(qū)別和聯(lián)系
如果大家只顧開發(fā),對基礎(chǔ)知識不了解,在今后的解決問題過程中,也是個大問題,今天小編抽空對基礎(chǔ)概念給大家屢一下,用于大家日后學(xué)習(xí)。
Vue.extend({})簡述:使用vue.extend返回一個子類構(gòu)造函數(shù),也就是預(yù)設(shè)部分選項的vue實例構(gòu)造器。
后可使用vue.component進(jìn)行實例化、或使用new extendName().$mount(''+el)方式進(jìn)行實例化(從而實現(xiàn)模擬組件)。

Vue.component({})簡述:不多介紹了。。。用于生成全局組件
使用:
1,Vue.component使用Vue.extend生成的構(gòu)造函數(shù):

2,實例化構(gòu)造函數(shù)從而模擬組件:

vue.extend與vue.component的區(qū)別總結(jié)
在Vue.js中,Vue本身是一個constructor。
Vue.extend() 是一個繼承于方法的 class,參數(shù)是一個包含組件選項的對象。它的目的是創(chuàng)建一個Vue的子類并且返回相應(yīng)的 constructor。
而Vue.component()實際上是一個類似于Vue.directive() 和 Vue.filter()的注冊方法,它的目的是給指定的一個constructor一個String類型的ID,
之后Vue.js可以把它用作模板,實際上當(dāng)你直接傳遞選項給Vue.component()的時候,它會在背后調(diào)用Vue.extend()。
Vue.js支持兩種不同的API模型:一種是基于類的,命令式的,Backbone 類型的API;另一種是基于標(biāo)記語言的,聲明式的,Web組件類型的API。
如果還是困惑的話,可以想象你是怎么創(chuàng)建通過new Image()或者 <img>標(biāo)簽創(chuàng)建 image元素的就知道了。
這兩種方法都對指定的類型很有用,Vue.js提供這兩者只是為了更好的靈活性。
下面看下vue.extend,new vue 和vue.component的區(qū)別
extend 是構(gòu)造一個組件的語法器. 你給它參數(shù) 他給你一個組件 然后這個組件
你可以作用到Vue.component 這個全局注冊方法里, 也可以在任意vue模板里使用apple組件
var apple = Vue.extend({ …. }) Vue.component(‘a(chǎn)pple',apple)
你可以作用到vue實例或者某個組件中的components屬性中并在內(nèi)部使用apple組件
new Vue({ components:{ apple:apple } })
Vue.component 你可以創(chuàng)建 ,也可以取組件 例如下
var apple = Vue.component(‘a(chǎn)pple') 而new vue 是新建一個vue對象 所以可以理解為new vue < vue.extand < vue.component
相關(guān)文章
使用vuex解決刷新頁面state數(shù)據(jù)消失的問題記錄
這篇文章主要介紹了使用vuex解決刷新頁面state數(shù)據(jù)消失的問題記錄,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
vue新建項目并配置標(biāo)準(zhǔn)路由過程解析
這篇文章主要介紹了vue新建項目并配置標(biāo)準(zhǔn)路由過程解析,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-12-12
vue使用JSON編輯器:vue-json-editor詳解
文章介紹了如何在Vue項目中使用JSON編輯器插件`vue-json-editor`,包括安裝、引入、注冊和使用示例,通過這些步驟,用戶可以在Vue應(yīng)用中輕松實現(xiàn)JSON數(shù)據(jù)的編輯功能,文章最后呼吁大家支持腳本之家2025-01-01

