(轉(zhuǎn))Vue中mixin的理解

mixins基礎概況

vue中的解釋是這樣的黔漂,如果覺得語言枯燥的可以自行跳過嘿~

混入 (mixins): 是一種分發(fā) Vue 組件中可復用功能的非常靈活的方式。混入對象可以包含任意組件選項。當組件使用混入對象時直晨,所有混入對象的選項將被混入該組件本身的選項霉撵。

怎么用枕面?

舉個栗子:

  • 定義一個混入對象
image
  • 把混入對象混入到當前的組件中
image

用法似不似相當簡單呀

mixins的特點

1 方法和參數(shù)在各組件中不共享

混合對象中的參數(shù)num

image

組件1中的參數(shù)num進行+1的操作

image

組件2中的參數(shù)num未進行操作

image

看兩組件中分別輸出的num值

image
image

大家可以看到稻轨,我在組件1里改變了num里面的值励翼,組件2中的num值還是混入對象里的初始值

2 值為對象的選項蜈敢,如methods,components等,選項會被合并汽抚,鍵沖突的組件會覆蓋混入對象的

混入對象中的方法

image

組件中的方法

image

打印臺的輸出

image

3 值為函數(shù)的選項抓狭,如created,mounted等,就會被合并調(diào)用造烁,混合對象里的鉤子函數(shù)在組件里的鉤子函數(shù)之前調(diào)用

混入對象函數(shù)中的console

image

組件函數(shù)中的console

image

打印臺的打印

image

與vuex的區(qū)別

經(jīng)過上面的例子之后否过,他們之間的區(qū)別應該很明顯了哈~

  • vuex:用來做狀態(tài)管理的,里面定義的變量在每個組件中均可以使用和修改惭蟋,在任一組件中修改此變量的值之后苗桂,其他組件中此變量的值也會隨之修改。

  • Mixins:可以定義共用的變量告组,在每個組件中使用煤伟,引入組件中之后,各個變量是相互獨立的,值的修改在組件中不會相互影響便锨。

與公共組件的區(qū)別

同樣明顯的區(qū)別來再列一遍哈~

  • 組件:在父組件中引入組件围辙,相當于在父組件中給出一片獨立的空間供子組件使用,然后根據(jù)props來傳值放案,但本質(zhì)上兩者是相對獨立的姚建。

  • Mixins:則是在引入組件之后與組件中的對象和方法進行合并,相當于擴展了父組件的對象與方法吱殉,可以理解為形成了一個新的組件掸冤。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市友雳,隨后出現(xiàn)的幾起案子贩虾,更是在濱河造成了極大的恐慌,老刑警劉巖沥阱,帶你破解...
    沈念sama閱讀 211,290評論 6 491
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件缎罢,死亡現(xiàn)場離奇詭異,居然都是意外死亡考杉,警方通過查閱死者的電腦和手機策精,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,107評論 2 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來崇棠,“玉大人咽袜,你說我怎么就攤上這事≌硐。” “怎么了询刹?”我有些...
    開封第一講書人閱讀 156,872評論 0 347
  • 文/不壞的土叔 我叫張陵,是天一觀的道長萎坷。 經(jīng)常有香客問我凹联,道長,這世上最難降的妖魔是什么哆档? 我笑而不...
    開封第一講書人閱讀 56,415評論 1 283
  • 正文 為了忘掉前任蔽挠,我火速辦了婚禮,結(jié)果婚禮上瓜浸,老公的妹妹穿的比我還像新娘澳淑。我一直安慰自己,他們只是感情好插佛,可當我...
    茶點故事閱讀 65,453評論 6 385
  • 文/花漫 我一把揭開白布杠巡。 她就那樣靜靜地躺著,像睡著了一般雇寇。 火紅的嫁衣襯著肌膚如雪氢拥。 梳的紋絲不亂的頭發(fā)上绑改,一...
    開封第一講書人閱讀 49,784評論 1 290
  • 那天,我揣著相機與錄音兄一,去河邊找鬼。 笑死识腿,一個胖子當著我的面吹牛出革,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播渡讼,決...
    沈念sama閱讀 38,927評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼骂束,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了成箫?” 一聲冷哼從身側(cè)響起展箱,我...
    開封第一講書人閱讀 37,691評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎蹬昌,沒想到半個月后混驰,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,137評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡皂贩,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,472評論 2 326
  • 正文 我和宋清朗相戀三年栖榨,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片明刷。...
    茶點故事閱讀 38,622評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡婴栽,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出辈末,到底是詐尸還是另有隱情愚争,我是刑警寧澤,帶...
    沈念sama閱讀 34,289評論 4 329
  • 正文 年R本政府宣布挤聘,位于F島的核電站轰枝,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏组去。R本人自食惡果不足惜狸膏,卻給世界環(huán)境...
    茶點故事閱讀 39,887評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望添怔。 院中可真熱鬧湾戳,春花似錦、人聲如沸广料。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,741評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽艾杏。三九已至韧衣,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背畅铭。 一陣腳步聲響...
    開封第一講書人閱讀 31,977評論 1 265
  • 我被黑心中介騙來泰國打工氏淑, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人硕噩。 一個月前我還...
    沈念sama閱讀 46,316評論 2 360
  • 正文 我出身青樓假残,卻偏偏與公主長得像,于是被迫代替她去往敵國和親炉擅。 傳聞我的和親對象是個殘疾皇子辉懒,可洞房花燭夜當晚...
    茶點故事閱讀 43,490評論 2 348

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

  • 這篇筆記主要包含 Vue 2 不同于 Vue 1 或者特有的內(nèi)容,還有我對于 Vue 1.0 印象不深的內(nèi)容谍失。關于...
    云之外閱讀 5,046評論 0 29
  • 我叫小金眶俩,與白素貞、小青是一個爹一個娘的兄弟快鱼,我們出身在峨眉山颠印,每天的生活都是愉快的嬉戲打鬧,突然有一天抹竹,王母打算...
    d4f2132148fb閱讀 489評論 0 1
  • 揚州方圓~~周亮 【知~學習】學習一級建造師考試內(nèi)容 《六項精進》3遍嗽仪。累積174遍 《大學》3遍。累積174遍 ...
    揚州方圓__周亮閱讀 89評論 0 1
  • 120年前柒莉,面對一個積貧積弱闻坚、內(nèi)憂外患的中國,一批仁人志士發(fā)動“戊戌變法”兢孝,試圖找到一條民族復興窿凤、國家富強的道路,...
    依然如水閱讀 484評論 0 4
  • 秋高氣爽夯秃,作為一個熱愛時尚的女生,除了衣著打扮痢艺、護膚品要換季外仓洼,就連10個小指上的彩繪,也該和單調(diào)的色彩 say ...
    尚熙閱讀 747評論 0 0