詳解vue 數(shù)據(jù)傳遞的方法
組件（Component）是 Vue.js 最強(qiáng)大的功能。組件可以封裝可重用的代碼，通過傳入對(duì)象的不同，實(shí)現(xiàn)組件的復(fù)用，但組件傳值就成為一個(gè)需要解決的問題。
1.父組件向子組件傳值
組件實(shí)例的作用域是孤立的。這意味著不能在子組件的模板內(nèi)直接引用父組件的數(shù)據(jù)。要讓子組件使用父組件的數(shù)據(jù)，我們需要通過子組件的props選項(xiàng)。
子組件：
![子組件需要從父組件獲取 logo 的值，就需要使用 props: ['logo']](http://img.jbzj.com/file_images/article/201804/2018041916044820.png)
子組件需要從父組件獲取 logo 的值，就需要使用 props: [‘logo']
父組件：
2.子組件向父組件傳值
子組件主要通過事件傳遞數(shù)據(jù)給父組件。
子組件：
其中 transferUser 是一個(gè)自定義的事件，this.username 將通過這個(gè)事件傳遞給父組件 。
父組件：
getUser 方法中的參數(shù) msg 就是從子組件傳遞過來的參數(shù) username
3.路由傳值
使用時(shí)，在生命周期created賦值。
4.通過localStorage或者sessionStorage來存儲(chǔ)數(shù)據(jù)
5.Vuex
在應(yīng)用復(fù)雜時(shí)，推薦使用vue官網(wǎng)推薦的vuex。
相關(guān)文章
vue實(shí)現(xiàn)前端按鈕組件權(quán)限管理
這篇文章主要為大家介紹了vue實(shí)現(xiàn)前端按鈕組件權(quán)限管理，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-09-09
vue3中利用Export2Excel將數(shù)據(jù)導(dǎo)出為excel表格
這篇文章主要給大家介紹了關(guān)于vue3中利用Export2Excel將數(shù)據(jù)導(dǎo)出為excel表格的相關(guān)資料,最近項(xiàng)目需要前端來導(dǎo)出Excel操作,所以給大家總結(jié)下,需要的朋友可以參考下2023-09-09
使用vue.js寫一個(gè)tab選項(xiàng)卡效果
Vue 實(shí)現(xiàn) Tab切換實(shí)現(xiàn)的場(chǎng)景很多，比如，利用vue-router、利用第三方插件、利用組件等等.本文使用組件來實(shí)踐tab選項(xiàng)卡2017-03-03
這篇文章主要為大家詳細(xì)介紹了vue雙花括號(hào)的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-11-11
vue在IIS服務(wù)器部署后路由無法跳轉(zhuǎn)
在IIS服務(wù)器上部署Vue項(xiàng)目時(shí),可能會(huì)遇到路由無法正常跳轉(zhuǎn)的問題,解決方法有兩種,下面就來具體介紹一下解決方法,感興趣的可以了解一下2024-10-10
vue3利用store實(shí)現(xiàn)記錄滾動(dòng)位置的示例
這篇文章主要介紹了vue3利用store實(shí)現(xiàn)記錄滾動(dòng)位置的示例，幫助大家更好的理解和學(xué)習(xí)使用vue框架，感興趣的朋友可以了解下2021-04-04
這篇文章主要給大家介紹了關(guān)于Vue.js實(shí)例方法之生命周期的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。2017-07-07
Vue3除了keep-alive還有哪些實(shí)現(xiàn)頁面緩存詳解
Vue3中的keep-alive組件用于緩存頁面,以便在切換頁面時(shí)保留其狀態(tài),下面這篇文章主要給大家介紹了關(guān)于Vue3除了keep-alive還有哪些實(shí)現(xiàn)頁面緩存的相關(guān)資料,需要的朋友可以參考下2024-04-04
這篇文章主要介紹了VueRouter導(dǎo)航守衛(wèi)的詳細(xì)用法以及分類介紹，有興趣的朋友學(xué)習(xí)參考下吧。2017-12-12
解決vite項(xiàng)目Uncaught Syntaxerror:Unexpected token＞vue項(xiàng)
這篇文章主要介紹了解決vite項(xiàng)目Uncaught Syntaxerror:Unexpected token＞vue項(xiàng)目上線白屏問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03