父組件向子組件傳參

數據：

父組件

<test :message="msg"></test> msg: 'Hello uniApp'

子組件（test.vue）

<text>{{message}}</text> props:["message"]

子組件向父組件傳參

子組件：

<input type="text" v-model="name" @change="setName"> <button @click="setName">點我</button>setName(){this.$emit('transferName',this.name)}

父組件：

<HelloWorld @transferName="getUser"></HelloWorld>getUser(data){this.user = data}

下面是將子組件的數據name通過綁定事件傳遞到父組件user的一個過程：

父組件傳遞子組件方法:

父組件

<test @testShow="testClick"></test> methods: {testClick(){console.log("你好")}}

子組件（test.vue）

<button type="primary" @click="test">點擊</button> methods: {test(){this.$emit("testShow")}}

總結

以上是生活随笔為你收集整理的Vue组件传参的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。