vue 元件資料通訊

2022-03-04 20:32:31 字數 1070 閱讀 5313

父元件傳給子元件props父元件設定props值

text:"元件內部資料傳遞"

注意:傳遞固定內容say="固定內容

" ,傳遞data裡面的變數

:say="text"

傳boolean值和物件

:componen-title='false'   :duixiang=""

子元件接收props
props: ,

componentitle:,

duixiang:

}

console.log(this.say);

console.log(this.componentitle);

console.log(this.duixiang);

父元件獲取子元件屬性和方法:

console.log(this.$refs.aaa.屬性名/方法名);

子元件傳給父元件this.

$emit父元件設定

<

aaa:

say=

"text"

ref="aaa" v-

on子元件設定

<

button

@click=

"onclickme

">觸發

button

>

bus通訊

Vue元件之間的資料通訊

最近在用vue做專案,學習了不少東西,但是有時候光顧著做專案卻忘記要找個時間來整理一下最近的一些學習新得,因為是新手,所以可能會有錯誤的地方,歡迎指出和交流呀 關於父子元件以及非父子元件之間的資料通訊 元件之間資料通訊.png 1 父子元件之間資料通訊 一般父元件向子元件傳遞資料用prop進行傳遞,...

Vue學習 元件中的資料通訊

目錄元件中的雙向繫結 父元件訪問子元件 children或 refs 子元件訪問父元件 parent 元件的擴充套件 slot 其它訊息內容 data components const cpnc vue.extend const cpnc vue.extend methods decrement f...

vue元件之間的資料通訊小例子

html html lang en head meta charset utf 8 title 元件之間的通訊 title head body script src js vue.js script div id son message msg son div script 編寫和註冊子元件 vue...