參數(shù):
{Object} options
用法:
使用基礎(chǔ) Vue 構(gòu)造器擂红,創(chuàng)建一個(gè)“子類”土砂。參數(shù)是一個(gè)包含組件選項(xiàng)的對(duì)象乏悄。
data?選項(xiàng)是特例龙亲,需要注意 - 在?Vue.extend()?中它必須是函數(shù)
// 創(chuàng)建構(gòu)造器varProfile = Vue.extend({template:'<p>{{firstName}} {{lastName}} aka {{alias}}</p>',data:function(){return{firstName:'Walter',lastName:'White',alias:'Heisenberg'}? }})// 創(chuàng)建 Profile 實(shí)例陕凹,并掛載到一個(gè)元素上。newProfile().$mount('#mount-point')
結(jié)果如下:
Walter White aka Heisenberg
參考:組件
Vue.nextTick( [callback, context] )
參數(shù):
{Function} [callback]
{Object} [context]
用法:
在下次 DOM 更新循環(huán)結(jié)束之后執(zhí)行延遲回調(diào)鳄炉。在修改數(shù)據(jù)之后立即使用這個(gè)方法杜耙,獲取更新后的 DOM。
// 修改數(shù)據(jù)vm.msg ='Hello'// DOM 還沒有更新Vue.nextTick(function(){// DOM 更新了})// 作為一個(gè) Promise 使用 (2.1.0 起新增拂盯,詳見接下來的提示)Vue.nextTick()? .then(function(){// DOM 更新了})
2.1.0 起新增:如果沒有提供回調(diào)且在支持 Promise 的環(huán)境中佑女,則返回一個(gè) Promise。請(qǐng)注意 Vue 不自帶 Promise 的 polyfill谈竿,所以如果你的目標(biāo)瀏覽器不原生支持 Promise (IE:你們都看我干嘛)团驱,你得自己提供 polyfill。
參考:異步更新隊(duì)列
Vue.set( target, propertyName/index, value )
參數(shù):
{Object | Array} target
{string | number} propertyName/index
{any} value
返回值:設(shè)置的值空凸。
用法:
向響應(yīng)式對(duì)象中添加一個(gè)屬性嚎花,并確保這個(gè)新屬性同樣是響應(yīng)式的,且觸發(fā)視圖更新呀洲。它必須用于向響應(yīng)式對(duì)象上添加新屬性紊选,因?yàn)?Vue 無法探測(cè)普通的新增屬性 (比如?this.myObject.newProperty = 'hi')
注意對(duì)象不能是 Vue 實(shí)例,或者 Vue 實(shí)例的根數(shù)據(jù)對(duì)象道逗。
Vue.delete( target, propertyName/index )
參數(shù):
{Object | Array} target
{string | number} propertyName/index
僅在 2.2.0+ 版本中支持 Array + index 用法兵罢。
用法:
刪除對(duì)象的屬性。如果對(duì)象是響應(yīng)式的滓窍,確保刪除能觸發(fā)更新視圖卖词。這個(gè)方法主要用于避開 Vue 不能檢測(cè)到屬性被刪除的限制,但是你應(yīng)該很少會(huì)使用它吏夯。
在 2.2.0+ 中同樣支持在數(shù)組上工作此蜈。
目標(biāo)對(duì)象不能是一個(gè) Vue 實(shí)例或 Vue 實(shí)例的根數(shù)據(jù)對(duì)象。
Vue.directive( id, [definition] )
參數(shù):
{string} id
{Function | Object} [definition]
用法:
注冊(cè)或獲取全局指令锦亦。
// 注冊(cè)Vue.directive('my-directive', {bind:function(){},inserted:function(){},update:function(){},componentUpdated:function(){},unbind:function(){}})// 注冊(cè) (指令函數(shù))Vue.directive('my-directive',function(){// 這里將會(huì)被 `bind` 和 `update` 調(diào)用})// getter舶替,返回已注冊(cè)的指令varmyDirective = Vue.directive('my-directive')
參考:自定義指令
Vue.filter( id, [definition] )
參數(shù):
{string} id
{Function} [definition]
用法:
注冊(cè)或獲取全局過濾器。
// 注冊(cè)Vue.filter('my-filter',function(value){// 返回處理后的值})// getter杠园,返回已注冊(cè)的過濾器varmyFilter = Vue.filter('my-filter')
參考:過濾器
Vue.component( id, [definition] )
參數(shù):
{string} id
{Function | Object} [definition]
用法:
注冊(cè)或獲取全局組件顾瞪。注冊(cè)還會(huì)自動(dòng)使用給定的id設(shè)置組件的名稱
// 注冊(cè)組件,傳入一個(gè)擴(kuò)展過的構(gòu)造器Vue.component('my-component', Vue.extend({/* ... */}))// 注冊(cè)組件抛蚁,傳入一個(gè)選項(xiàng)對(duì)象 (自動(dòng)調(diào)用 Vue.extend)Vue.component('my-component', {/* ... */})// 獲取注冊(cè)的組件 (始終返回構(gòu)造器)varMyComponent = Vue.component('my-component')
參考:組件
參數(shù):
{Object | Function} plugin
用法:
安裝 Vue.js 插件陈醒。如果插件是一個(gè)對(duì)象,必須提供?install?方法瞧甩。如果插件是一個(gè)函數(shù)钉跷,它會(huì)被作為 install 方法。install 方法調(diào)用時(shí)肚逸,會(huì)將 Vue 作為參數(shù)傳入爷辙。
該方法需要在調(diào)用?new Vue()?之前被調(diào)用彬坏。
當(dāng) install 方法被同一個(gè)插件多次調(diào)用,插件將只會(huì)被安裝一次膝晾。
參考:插件
參數(shù):
{Object} mixin
用法:
全局注冊(cè)一個(gè)混入栓始,影響注冊(cè)之后所有創(chuàng)建的每個(gè) Vue 實(shí)例。插件作者可以使用混入血当,向組件注入自定義的行為幻赚。不推薦在應(yīng)用代碼中使用。
參考:全局混入
參數(shù):
{string} template
用法:
將一個(gè)模板字符串編譯成render函數(shù)臊旭。只在完整版時(shí)可用落恼。
varres = Vue.compile('<div><span>{{ msg }}</span></div>')newVue({data: {msg:'hello'},render: res.render,staticRenderFns: res.staticRenderFns})
參考:渲染函數(shù)
2.6.0 新增
參數(shù):
{Object} object
用法:
讓一個(gè)對(duì)象可響應(yīng)。Vue 內(nèi)部會(huì)用它來處理?data?函數(shù)返回的對(duì)象离熏。
返回的對(duì)象可以直接用于渲染函數(shù)和計(jì)算屬性內(nèi)佳谦,并且會(huì)在發(fā)生改變時(shí)觸發(fā)相應(yīng)的更新。也可以作為最小化的跨組件狀態(tài)存儲(chǔ)器撤奸,用于簡(jiǎn)單的場(chǎng)景:
conststate = Vue.observable({count:0})constDemo = {? render(h) {returnh('button', {on: {click:()=>{ state.count++ }}? ? },`count is:${state.count}`)? }}
在 Vue 2.x 中吠昭,被傳入的對(duì)象會(huì)直接被?Vue.observable?改變,所以如這里展示的胧瓜,它和被返回的對(duì)象是同一個(gè)對(duì)象矢棚。在 Vue 3.x 中,則會(huì)返回一個(gè)可響應(yīng)的代理府喳,而對(duì)源對(duì)象直接進(jìn)行修改仍然是不可響應(yīng)的蒲肋。因此,為了向前兼容钝满,我們推薦始終操作使用?Vue.observable?返回的對(duì)象兜粘,而不是傳入源對(duì)象。
細(xì)節(jié):提供字符串形式的 Vue 安裝版本號(hào)弯蚜。這對(duì)社區(qū)的插件和組件來說非常有用孔轴,你可以根據(jù)不同的版本號(hào)采取不同的策略。
用法:
varversion =Number(Vue.version.split('.')[0])if(version ===2) {// Vue v2.x.x}elseif(version ===1) {// Vue v1.x.x}else{// Unsupported versions of Vue}