在學習vue過程中自己總結了幾種元件間傳值的方式

1、路由傳參

步驟：

①定義路由時加上引數props: true，在定義路由路徑時要留有引數佔位符: name『用法: to=”’路徑/’＋value”』 ②在跳轉到的頁面加上引數props:[‘name’] ③在跳轉到的頁面就獲取到了name『用法: js中直接this. name；html中直接插值{{ name}}』

2、父元件向子元件傳值

步驟：

①父元件內設定要傳的資料『data(){ id: value}』 ②在父元件中引用的子元件上繫結一個自定義屬性並把資料繫結在自定義屬性上『< myBtn :atrid=’id’>』 ③在子元件新增引數props:[‘atrid’],即可

3、子元件向父元件傳值

步驟：

①由於父元件需要引數，所以在父元件中的標籤上定義自定義事件，在事件內部獲取引數；『@myEvent=” callback”在callback函式中接收引數』 ②在子元件中觸發自定義事件，並傳參。『this.$ emit(‘父元件中的自定義事件’,引數)』

4、元件之間傳值

步驟：

(1)方法一、 ①建立一個公共的通訊元件( Vue)，需要傳值的元件裡引入該通訊元件 ②在一箇中繫結一個事件this.on(‘eventname’, this. id) ③在另一個元件中觸發事件this.$ emit(‘eventname’,( options)=>{}) (2)方法二、 在本地儲存中新增公共資料，可以在兩個頁面中獲取，更改

因為是轉移自己之前的筆記，所以沒有貼程式碼，等有時間會補充的，如果你有問題，可以直接私聊我喲~