vue-全局 API

Vue.extend( options )

參數(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ì)象。

參考深入響應(yīng)式原理

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')

參考組件

Vue.use( plugin )

參數(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ì)被安裝一次膝晾。

參考插件

Vue.mixin( mixin )

參數(shù)

{Object} mixin

用法

全局注冊(cè)一個(gè)混入栓始,影響注冊(cè)之后所有創(chuàng)建的每個(gè) Vue 實(shí)例。插件作者可以使用混入血当,向組件注入自定義的行為幻赚。不推薦在應(yīng)用代碼中使用

參考全局混入

Vue.compile( template )

參數(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ù)

Vue.observable( object )

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ì)象。

參考深入響應(yīng)式原理

Vue.version

細(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}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末碎捺,一起剝皮案震驚了整個(gè)濱河市路鹰,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌收厨,老刑警劉巖晋柱,帶你破解...
    沈念sama閱讀 218,858評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異诵叁,居然都是意外死亡雁竞,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門拧额,熙熙樓的掌柜王于貴愁眉苦臉地迎上來碑诉,“玉大人彪腔,你說我怎么就攤上這事×罚” “怎么了漫仆?”我有些...
    開封第一講書人閱讀 165,282評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)泪幌。 經(jīng)常有香客問我,道長(zhǎng)署照,這世上最難降的妖魔是什么祸泪? 我笑而不...
    開封第一講書人閱讀 58,842評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮建芙,結(jié)果婚禮上没隘,老公的妹妹穿的比我還像新娘。我一直安慰自己禁荸,他們只是感情好右蒲,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,857評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著赶熟,像睡著了一般瑰妄。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上映砖,一...
    開封第一講書人閱讀 51,679評(píng)論 1 305
  • 那天间坐,我揣著相機(jī)與錄音,去河邊找鬼邑退。 笑死竹宋,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的地技。 我是一名探鬼主播蜈七,決...
    沈念sama閱讀 40,406評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼莫矗!你這毒婦竟也來了飒硅?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,311評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤趣苏,失蹤者是張志新(化名)和其女友劉穎狡相,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體食磕,經(jīng)...
    沈念sama閱讀 45,767評(píng)論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡尽棕,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,945評(píng)論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了彬伦。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片滔悉。...
    茶點(diǎn)故事閱讀 40,090評(píng)論 1 350
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡伊诵,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出回官,到底是詐尸還是另有隱情曹宴,我是刑警寧澤,帶...
    沈念sama閱讀 35,785評(píng)論 5 346
  • 正文 年R本政府宣布歉提,位于F島的核電站笛坦,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏苔巨。R本人自食惡果不足惜版扩,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,420評(píng)論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望侄泽。 院中可真熱鬧礁芦,春花似錦、人聲如沸悼尾。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,988評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽闺魏。三九已至未状,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間舷胜,已是汗流浹背娩践。 一陣腳步聲響...
    開封第一講書人閱讀 33,101評(píng)論 1 271
  • 我被黑心中介騙來泰國(guó)打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留烹骨,地道東北人翻伺。 一個(gè)月前我還...
    沈念sama閱讀 48,298評(píng)論 3 372
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像沮焕,于是被迫代替她去往敵國(guó)和親吨岭。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,033評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容

  • 一峦树、Vue.directive自定義指令 可以定義一些屬于自己的指令辣辫,比如我們要定義一個(gè)v-fang的指令,作用就...
    PYFang閱讀 1,299評(píng)論 0 0
  • Vue 實(shí)例 屬性和方法 每個(gè) Vue 實(shí)例都會(huì)代理其 data 對(duì)象里所有的屬性:var data = { a:...
    云之外閱讀 2,214評(píng)論 0 6
  • Vue.use(plugins) 注冊(cè)一個(gè)插件 例子: Vue.directive()創(chuàng)建或者獲取自定義指令 一個(gè)...
    5b5072cc2c5b閱讀 10,222評(píng)論 0 1
  • 組件 什么是組件魁巩?我所理解的組件急灭,是和視圖相關(guān)的,比如一個(gè)頁面谷遂,可以分成多個(gè)模塊葬馋,那么每一個(gè)模塊就可以看成是一個(gè)組...
    一蓑煙雨任平生_cui閱讀 385評(píng)論 1 1
  • 最近在做直播相關(guān)的東西,這個(gè)動(dòng)畫是IOS先擼出來的,后來android這邊要模仿畴嘶,大部分直播應(yīng)用都有很炫酷的點(diǎn)贊動(dòng)...
    尹star閱讀 7,578評(píng)論 0 35