Vue中一些API和選項(xiàng)

isRef()

顧名思義,判斷一個(gè)值是否為ref類型

unref()

解除ref的包裹趁尼,即如果參數(shù)是ref剩蟀,則返回內(nèi)部值舷夺,否則返回值本身

toRefs()

const fooRef = ref(state.foo)

請(qǐng)注意苦酱,上面這個(gè) ref 不會(huì)和 state.foo 保持同步,因?yàn)檫@個(gè)ref()接收到的是一個(gè)純數(shù)值给猾。
toRef() 這個(gè)函數(shù)在你想把一個(gè) prop 的 ref 傳遞給一個(gè)組合式函數(shù)時(shí)會(huì)很有用:

toValue

refgetter規(guī)范化為值疫萤。如果參數(shù)是ref,它會(huì)返回ref的值敢伸;如果參數(shù)是函數(shù)扯饶,它會(huì)調(diào)用函數(shù)并返回其返回值。否則,將會(huì)原樣返回參數(shù)尾序。
這是官方組合式函數(shù)中的一個(gè)例子:

toRefs()

將一個(gè)響應(yīng)式對(duì)象轉(zhuǎn)化為一個(gè)普通對(duì)象钓丰,而這個(gè)普通對(duì)象的屬性將會(huì)被轉(zhuǎn)化為ref,相當(dāng)于對(duì)每個(gè)屬性都使用了toRef()

當(dāng)從組合式函數(shù)中返回響應(yīng)式對(duì)象時(shí)每币,toRefss()相當(dāng)有用斑粱。使用它,消費(fèi)者組件可以解構(gòu)/展開返回的對(duì)象而不會(huì)失去響應(yīng)性:

isProxy()

檢查一個(gè)對(duì)象是否是由reactive()脯爪、readonly()shallowReactive()shallowReadonly創(chuàng)建的代理矿微。

isReactive()

檢查一個(gè)對(duì)象是否是由 reactive()shallowReactive() 創(chuàng)建的代理痕慢。

isReadonly()

檢查傳入的值是否為只讀對(duì)象。只讀對(duì)象的屬性可以更改涌矢,但他們不能通過傳入的對(duì)象直接賦值掖举。
通過 readonly()shallowReadonly() 創(chuàng)建的代理都是只讀的,因?yàn)樗麄兪菦]有 set 函數(shù)的 computed()ref娜庇。


shallowRef()

常常用于對(duì)大型數(shù)據(jù)解構(gòu)的性能優(yōu)化或是與外部的狀態(tài)管理系統(tǒng)集成塔次。

triggerRef()

強(qiáng)制觸發(fā)依賴于一個(gè)淺層ref()的副作用,這通常在對(duì)潛引用的內(nèi)部值進(jìn)行深度變更后使用名秀。

customRef()

創(chuàng)建一個(gè)自定義的ref励负,顯式聲明對(duì)其依賴追蹤和更新觸發(fā)的控制方式。
customRef() 預(yù)期接收一個(gè)工廠函數(shù)作為參數(shù)匕得,這個(gè)工廠函數(shù)接受 track 和 trigger 兩個(gè)函數(shù)作為參數(shù)继榆,并返回一個(gè)帶有 get 和 set 方法的對(duì)象。
一般來說汁掠,track() 應(yīng)該在 get() 方法中調(diào)用略吨,而 trigger() 應(yīng)該在 set() 中調(diào)用。然而事實(shí)上考阱,你對(duì)何時(shí)調(diào)用翠忠、是否應(yīng)該調(diào)用他們有完全的控制權(quán)。

示例:創(chuàng)建一個(gè)防抖ref

shallowReactive()

一個(gè)淺層響應(yīng)式對(duì)象里只有根級(jí)別的屬性是響應(yīng)式的乞榨。屬性的值會(huì)被原樣存儲(chǔ)和暴露秽之,這也意味著值為ref的屬性不會(huì)被自動(dòng)解包了。

shallowReadonly()

readonly()的淺層作用形式
readonly()不同姜凄,這里沒有深層級(jí)的轉(zhuǎn)換:只有根層級(jí)的屬性變?yōu)榱酥蛔x政溃。屬性的值都會(huì)被原樣存儲(chǔ)和暴露,這也意味著值為ref的屬性不會(huì)被自動(dòng)解包态秧。

toRaw()

根據(jù)一個(gè)Vue創(chuàng)建的代理返回其原始對(duì)象

markRaw()

將一個(gè)對(duì)象轉(zhuǎn)為不可被轉(zhuǎn)為代理董虱。

effectScope

創(chuàng)建一個(gè)effect作用域,可以捕獲其中所創(chuàng)建的響應(yīng)式副作用(即計(jì)算屬性和幀聽器),這樣捕獲到的副作用可以一起處理愤诱。

getCurrentScope()

如果有的話云头,返回當(dāng)前活躍的effect作用域。

onScopeDispose()

在當(dāng)前活躍的effect作用域上注冊(cè)一個(gè)處理回調(diào)函數(shù)淫半。當(dāng)相關(guān)的 effect 作用域停止時(shí)會(huì)調(diào)用這個(gè)回調(diào)函數(shù)溃槐。
這個(gè)方法可以作為可復(fù)用的組合式函數(shù)中 onUnmounted 的替代品,它并不與組件耦合科吭,因?yàn)槊恳粋€(gè) Vue 組件的 setup() 函數(shù)也是在一個(gè) effect 作用域中調(diào)用的昏滴。


mixins

意為混入,可以使用可復(fù)用的代碼

  • 基本使用

如果組件和mixins有重復(fù)數(shù)據(jù)对人,mixins中的數(shù)據(jù)會(huì)被覆蓋谣殊。

  • 全局引用

render函數(shù)

我的理解就是手動(dòng)創(chuàng)建界面元素

  • 基本使用

同樣能看到效果


ref

通過ref獲取DOM元素

如果用于普通DOM元素,引用將是元素本身牺弄;如果用于子組件姻几,引用將是子組件的實(shí)例。父組件往往可以通過ref訪問子組件暴露的數(shù)據(jù)势告。
或者ref可以接收一個(gè)函數(shù)值蛇捌,用于對(duì)存儲(chǔ)引用位置的完全控制:

<ChildComponent :ref="(el) => child = el" />

關(guān)于ref注冊(cè)時(shí)機(jī)的重要說明:因?yàn)閞ef本身是作為渲染函數(shù)的結(jié)果來創(chuàng)建的,必須等待組件掛載后才能對(duì)它進(jìn)行訪問咱台。調(diào)用方式"ref名.value.子組件暴露的屬性"
this.$refs也是非響應(yīng)式的络拌,因此不應(yīng)該在模板中使用它來進(jìn)行數(shù)據(jù)綁定。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末吵护,一起剝皮案震驚了整個(gè)濱河市盒音,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌馅而,老刑警劉巖祥诽,帶你破解...
    沈念sama閱讀 219,539評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異瓮恭,居然都是意外死亡雄坪,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,594評(píng)論 3 396
  • 文/潘曉璐 我一進(jìn)店門屯蹦,熙熙樓的掌柜王于貴愁眉苦臉地迎上來维哈,“玉大人,你說我怎么就攤上這事登澜±樱” “怎么了?”我有些...
    開封第一講書人閱讀 165,871評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵脑蠕,是天一觀的道長购撼。 經(jīng)常有香客問我跪削,道長,這世上最難降的妖魔是什么迂求? 我笑而不...
    開封第一講書人閱讀 58,963評(píng)論 1 295
  • 正文 為了忘掉前任碾盐,我火速辦了婚禮,結(jié)果婚禮上揩局,老公的妹妹穿的比我還像新娘毫玖。我一直安慰自己,他們只是感情好凌盯,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,984評(píng)論 6 393
  • 文/花漫 我一把揭開白布付枫。 她就那樣靜靜地躺著,像睡著了一般驰怎。 火紅的嫁衣襯著肌膚如雪励背。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,763評(píng)論 1 307
  • 那天砸西,我揣著相機(jī)與錄音,去河邊找鬼址儒。 笑死芹枷,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的莲趣。 我是一名探鬼主播鸳慈,決...
    沈念sama閱讀 40,468評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼喧伞!你這毒婦竟也來了走芋?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,357評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤潘鲫,失蹤者是張志新(化名)和其女友劉穎翁逞,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體溉仑,經(jīng)...
    沈念sama閱讀 45,850評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡挖函,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 38,002評(píng)論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了浊竟。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片怨喘。...
    茶點(diǎn)故事閱讀 40,144評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖振定,靈堂內(nèi)的尸體忽然破棺而出必怜,到底是詐尸還是另有隱情,我是刑警寧澤后频,帶...
    沈念sama閱讀 35,823評(píng)論 5 346
  • 正文 年R本政府宣布影钉,位于F島的核電站侧啼,受9級(jí)特大地震影響笑诅,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜丧肴,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,483評(píng)論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望胧后。 院中可真熱鬧芋浮,春花似錦、人聲如沸壳快。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,026評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽眶痰。三九已至瘤旨,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間竖伯,已是汗流浹背存哲。 一陣腳步聲響...
    開封第一講書人閱讀 33,150評(píng)論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留七婴,地道東北人祟偷。 一個(gè)月前我還...
    沈念sama閱讀 48,415評(píng)論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像打厘,于是被迫代替她去往敵國和親修肠。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,092評(píng)論 2 355

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