vue prop屬性傳值與傳引用示例
更新時間：2019年11月13日 15:28:57 作者：幻歡子
今天小編就為大家分享一篇vue prop屬性傳值與傳引用示例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
vue組件在prop里根據(jù)type決定傳值還是傳引用。
簡要如下：
傳值：String、Number、Boolean
傳引用：Array、Object
若想將數(shù)組或對象類型也以值形式傳遞怎么辦呢？如下方式可以實現(xiàn)：
// component-A 引用component-B組件
<component-B :person="personList"
:personBak="person_Bak">
</component-B>
// component-A 部分關鍵代碼
// 將數(shù)組復制，personBak與personList是兩個“內容”相同但地址不一樣的對象(數(shù)組),
// 這樣可以變相的實現(xiàn)“傳值”，person或personBak互不影響
person_Bak = JSON.parse(JSON.stringfy(this.personList));
//component-B props部分
props: {
person: {
type: Object,
default: {}
},
personBak: {
type: Object,
default: {}
}
}
以上這篇vue prop屬性傳值與傳引用示例就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
解決Vue3?echarts?v-show無法重新渲染的問題
這篇文章主要介紹了Vue3?echarts?v-show無法重新渲染的問題,本文通過示例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-09-09
Vue的生命周期就是vue實例從創(chuàng)建到銷毀的全過程,也就是new Vue() 開始就是vue生命周期的開始。Vue 實例有?個完整的?命周期,也就是從開始創(chuàng)建、初始化數(shù)據(jù)、編譯模版、掛載Dom -> 渲染、更新 -> 渲染、卸載 等?系列過程,稱這是Vue的?命周期2022-09-09
Vue3通過hooks方式封裝節(jié)流和防抖的代碼詳解
vue3 中的 hooks 就是函數(shù)的一種寫法,就是將文件的一些單獨功能的js代碼進行抽離出來,放到單獨的js文件中,或者說是一些可以復用的公共方法/功能,本文給大家介紹了Vue3通過hooks方式封裝節(jié)流和防抖,需要的朋友可以參考下2024-10-10
在前端開發(fā)中,我們時常需要處理文件上傳和下載的功能,本文主要和大家分享一下如何使用Vue3和JSZip庫在瀏覽器端實現(xiàn)zip文件壓縮,需要的可以參考下2024-05-05
這篇文章主要介紹了Vue2?響應式系統(tǒng)之數(shù)組，本文接著上幾篇文章Vue2響應式系統(tǒng)?、Vue2?響應式系統(tǒng)之分支切換，響應式系統(tǒng)之嵌套、響應式系統(tǒng)之深度響應?展開相關內容,需要的朋友可以參考一下2022-04-04
這篇文章主要介紹了玩轉vue的slot內容分發(fā)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-09-09
這篇文章主要介紹了vue微信分享，在當前頁面分享其他頁面，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-04-04
淺析Vue3中通過v-model實現(xiàn)父子組件的雙向數(shù)據(jù)綁定及利用computed簡化父子組件雙向綁定
這篇文章主要介紹了淺析Vue3中通過v-model實現(xiàn)父子組件的雙向數(shù)據(jù)綁定及利用computed簡化父子組件雙向綁定,需要的朋友可以參考下2022-12-12
本文就討論下怎么實現(xiàn)一個處理.vue文件的loader，以及用loader處理完.vue文件怎么把內容渲染在瀏覽器上并實現(xiàn)簡單的響應式，對vue文件解析器相關知識感興趣的朋友一起看看吧2022-06-06
這篇文章主要介紹了Vue2.0 ES6語法降級ES5的操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-10-10