vue子組件如何向父組件傳值?<template>
<!--綁定自定義事件-->
<HelloWorld @custE="getCData"/>
</template>
<script>
// 引入子組件
import HelloWorld from './components/HelloWorld.vue'
export default {
name: 'App',
data() {
return {
}
},
components: {
// 注冊子組件
HelloWorld
},
methods: {
// 獲取子組件傳來的數據
getCData(value) {
console.log(value);
}
}
}
</script>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
,我來為大家科普一下關于vue子組件如何向父組件傳值?以下内容希望對你有幫助!
<template>
<!--綁定自定義事件-->
<HelloWorld @custE="getCData"/>
</template>
<script>
// 引入子組件
import HelloWorld from './components/HelloWorld.vue'
export default {
name: 'App',
data() {
return {
}
},
components: {
// 注冊子組件
HelloWorld
},
methods: {
// 獲取子組件傳來的數據
getCData(value) {
console.log(value);
}
}
}
</script>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
<template>
<div class="hello" @click="twoE"></div>
</template>
<script>
export default {
data() {
return {
childData: 'childData111'
}
},
methods: {
twoE() {
// 使用$emit向父組件傳值
this.$emit('custE',this.childData);
},
}
}
</script>
<style scoped>
.hello {
width: 100px;
height: 100px;
background: red;
}
</style>
更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!