資訊專欄INFORMATION COLUMN
摘要：簡單總結(jié)在使用傳遞數(shù)據(jù)的過程中，如果傳遞的是基本數(shù)據(jù)類型，則在子組件中不能修改父組件傳遞過來的值，此時符合的單向數(shù)據(jù)流方式如果傳遞的是引用型數(shù)據(jù)類型，則此時可以在子組件操作父組件傳遞過來的值，此時數(shù)據(jù)可以雙向通信，違背單向數(shù)據(jù)流方式。
第一：傳遞string、number等基本數(shù)據(jù)類型：
在構(gòu)建vue項目中，props是子組件獲取父組件的一種形式；在子組件中不可修改父組件傳遞的參數(shù)，代碼如下：
1、父組件代碼：
2、子組件代碼：
這是子組件這是父組件的值：{{fatherPassChild}}
注釋：
頁面展示子組件修改后的值：
“這是子組件
這是父組件的值：888”；
在子組件中，嘗試修改父組件傳遞過來的值，此時chrome控制臺會報錯:
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop"s value. Prop being mutated: "fatherPassChild"；
同時，父組件中，打印的字段為修改之前的字段:
父傳子 。
第二：傳遞數(shù)組、對象等引用型數(shù)據(jù)類型：
如果通過props傳遞引用數(shù)據(jù)類型，在子組件中改修父組件的屬性值，會出現(xiàn)什么情況？擼碼如下：
1、父組件代碼：
2、子組件代碼：
這是子組件這是父組件的值：{{fatherPassChild.objData}}
注釋：
此時，頁面展示的內(nèi)容是子組件修改后；同時，控制臺并沒有報錯；why？
按照官網(wǎng)的解釋：
注意在 JavaScript 中對象和數(shù)組是通過引用傳入的，所以對于一個數(shù)組或?qū)ο箢愋偷?prop 來說，在子組件中改變這個對象或數(shù)組本身將會影響到父組件的狀態(tài)。
簡單總結(jié)：1、在使用props傳遞數(shù)據(jù)的過程中，如果傳遞的是基本數(shù)據(jù)類型，則在子組件中不能修改父組件傳遞過來的值，此時符合vue的單向數(shù)據(jù)流方式；
2、如果傳遞的是引用型數(shù)據(jù)類型，則此時可以在子組件操作父組件傳遞過來的值，此時數(shù)據(jù)可以雙向通信，違背單向數(shù)據(jù)流方式。
個人理解：props傳遞參數(shù)不同，導(dǎo)致子組件是否能更改父組件props傳遞的值；跟const聲明變量類似。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/106116.html
摘要：我們需要在里改動一下代碼首先就是綁定一個自定義事件再增加然后在中變成就是觸發(fā)父組件中的方法所以，觸發(fā)了父組件的函數(shù)，改變了父組件的的值，父組件再通過傳值給子組件。從而實現(xiàn)數(shù)據(jù)傳遞，父子組件通信。 一、vue的父子組件之間是如何傳值的？ 首先呢，需要說說的是，vue既然有雙向綁定，那為何會有父子組件之間的傳值問題？這個問題也簡單，vue的組件會供其他的vue頁面進行調(diào)用，如果數(shù)組都是雙...
摘要：在模式中一般把層算在層中，只有在理想的雙向綁定模式下，才會完全的消失。層將通過特定的展示出來，并在控件上綁定視圖交互事件，一般由框架自動生成在瀏覽器中。三大框架的異同三大框架都是數(shù)據(jù)驅(qū)動型的框架及是雙向數(shù)據(jù)綁定是單向數(shù)據(jù)綁定。 MVVM相關(guān)概念 1） MVVM典型特點是有四個概念：Model、View、ViewModel、綁定器。MVVM可以是單向綁定也可以是雙向綁定甚至是不綁...
摘要：是一個事件，它向下傳播到當前實例的所有后代。由于后代擴展為多個子樹，事件傳播將會遵循許多不同的路徑。組件修改實現(xiàn)遞歸地在父鏈上傳播事件。 組件通信 父子組件通信 父傳子 props屬性 子傳父 $emit事件 這兩種官方文檔里有很詳細的介紹就不解釋了 還是舉個栗子： //parent.vue父組件 parent: {{money}} ...
摘要：的單向數(shù)據(jù)傳遞直接作為一個本地變量下面是我的子組件這是父組件給我傳的數(shù)據(jù)運行結(jié)果如下圖子組件向父組件傳遞數(shù)據(jù)基本使用子組件向父組件傳遞數(shù)據(jù)，不能像上面一樣實時的傳遞數(shù)據(jù)，必須通過事件觸發(fā)。 組件是Vue核心功能之一，合理的組件化，可以減少我們代碼的冗余，提高項目的可維護性。下面，我將由淺入深的講Vue的組件在講之前，首先我們先了解一下組件的命名。 HTML是對特征名不敏感的語言，他...
摘要：，至此咱們的微信小程序的簡單使用及了解算是分享完了，畢竟個人也是道行有限，沒有鉆研太深，這些只是本人在實際項目開發(fā)過程中用到和總結(jié)的經(jīng)驗，有太多不足或不對的地方，希望大家多多給予指出與改正，咱們一起來共同學(xué)習(xí)與進步 微信小程序是一種不需要下載安裝即可使用的應(yīng)用，在國內(nèi)它在企業(yè)推廣中的受歡迎度以及就這兩年的使用及普及熱度，然而就是因為它的備受歡迎度以及越來越被企業(yè)所重視，也就形成了咱們開...
閱讀 3791·2021-10-12 10:11
閱讀 2049·2019-08-30 15:53
閱讀 1649·2019-08-30 13:15
閱讀 2360·2019-08-30 11:25
閱讀 1882·2019-08-29 11:24
閱讀 1720·2019-08-26 13:53
閱讀 3609·2019-08-26 13:22
閱讀 1861·2019-08-26 10:24
