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