您现在的位置是:网站首页> 编程资料编程资料
vue中实现子组件接收父组件方法并获取返回值_vue.js_
2023-05-24
291人已围观
简介 vue中实现子组件接收父组件方法并获取返回值_vue.js_
子组件接收父组件方法并获取返回值
项目中有时候会遇到父子组件传值的问题,比如子组件需要接收父组件方法并获取该方法返回值的时候。
使用this.$emit('方法名', '参数1', '参数2')的方式,获取到不是父组件方法的return值。但是我们可以将参数改为回调函数的形式,父组件里执行该回调函数,返回值后给子组件,子组件再接收返回值。
示例:
父组件 GetCallback.vue
我是父组件
子组件 CallbackChild1.vue
我是子组件
返回值:{{ value }}
子组件接收父组件的另一种方法
子组件获取父组件传递的数据通常是通过props属性接收父组件的传递过来的数据,
代码如下:
Document
也可以通过子组件的$attrs接收的父组件的数据,但是这时候传递的数据子组件中不能有props的属性,不然子组件的$attrs获得的是空对象,
代码如下:
Document
以上为个人经验,希望能给大家一个参考,也希望大家多多支持。
相关内容
- React Native 中处理 Android 手机吞字的解决方案_React_
- js判断一个对象是否在一个对象数组中(场景分析)_javascript技巧_
- Node.js文件系统fs扩展fs-extra说明_node.js_
- vue3中的抽离封装方法实现_vue.js_
- Vue 中v-model的完整用法及原理_vue.js_
- 从reflect metadata理解Nest实现原理_node.js_
- 如何用nodejs搭建代理服务器_node.js_
- pnpm对npm及yarn降维打击详解_JavaScript_
- React路由拦截模式及withRouter示例详解_React_
- 关于react ant 组件 Select下拉框 值回显的问题_React_
