1.Props传
通过Pros将父亲的methods方法传给子，子用 click来接收这个方法。
A（父）
<template>
<div>
<B :cutPrice="cutPrice"></B>
</div>
</template>
<script>
import B from "./B.vue";
export default {
data() {
return {};
},
activated() {},
watch: {},
created() {},
mounted() {},
methods: {
cutPrice(name){
console.log(name);
}
},
components: {B},
};
</script>
<style>
</style>
B（子）
<template>
<div>
<button @click="cutPrice(1)"></button>
</div>
</template>
<script>
export default {
props:["cutPrice"],
data() {
return {
}
},
activated() {
},
watch: {
},
created(){
},
mounted(){
},
methods:{
}
}
</script>
<style>
</style>
2.官方$emit
A(父) 自定义一个事件，在子中去触发
<template>
<div>
<B @updatePrice="cutPrice"></B>
</div>
</template>
<script>
import B from "./B.vue";
export default {
data() {
return {};
},
activated() {},
watch: {},
created() {},
mounted() {},
methods: {
cutPrice(name) {
console.log(name);
},
},
components: { B },
};
</script>
<style>
</style>
子（B）
<template>
<div>
<button @click="xx">123</button>
</div>
</template>
<script>
export default {
data() {
return {};
},
activated() {},
watch: {},
created() {},
mounted() {},
methods: {
xx(){
this.$emit("updatePrice",11)
}
},
};
</script>
<style>
</style>
3.通过在子$parent调用父亲A中的属性
A（父亲）
<template>
<div>
<B></B>
</div>
</template>
<script>
import B from "./B.vue";
export default {
data() {
return {};
},
activated() {},
watch: {},
created() {},
mounted() {},
methods: {
cutPrice(name) {
console.log(name);
},
},
components: { B },
};
</script>
<style>
</style>
B（子）
<template>
<div>
<button @click="xx">123</button>
</div>
</template>
<script>
export default {
data() {
return {};
},
activated() {},
watch: {},
created() {},
mounted() {},
methods: {
xx(){
// this.$emit("updatePrice",11)
// console.log(this.$parent);
this.$parent.cutPrice(22)
}
},
};
</script>
<style>
</style>
今天的文章子传父的3种方式_父亲的遗传分享到此就结束了，感谢您的阅读，如果确实帮到您，您可以动动手指转发给其他人。
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
如需转载请保留出处：https://bianchenghao.cn/45295.html
