組件(Component)是 Vue.js 最強大的功能。組件可以封裝可重用的代碼，通過傳入對象的不同，實現(xiàn)組件的復(fù)用，但組件傳值就成為一個需要解決的問題。

1.父組件向子組件傳值

組件實例的作用域是孤立的。這意味著不能在子組件的模板內(nèi)直接引用父組件的數(shù)據(jù)。要讓子組件使用父組件的數(shù)據(jù)，我們需要通過子組件的props選項。

子組件：

子組件需要從父組件獲取 logo 的值，就需要使用 props: [‘logo']

父組件：

2.子組件向父組件傳值

子組件主要通過事件傳遞數(shù)據(jù)給父組件。

子組件：

其中 transferUser 是一個自定義的事件，this.username 將通過這個事件傳遞給父組件 。

父組件：

getUser 方法中的參數(shù) msg 就是從子組件傳遞過來的參數(shù) username

3.路由傳值

使用時，在生命周期created賦值。

4.通過localStorage或者sessionStorage來存儲數(shù)據(jù)

5.Vuex

在應(yīng)用復(fù)雜時，推薦使用vue官網(wǎng)推薦的vuex。

總結(jié)

以上是生活随笔為你收集整理的vue 传递多行数据_vue 数据传递的方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。