vue 父组件中调用子组件函数的方法


Posted in Javascript onJune 06, 2019

在父组件中调用子组件的方法:

 1.给子组件定义一个ref属性。eg:ref="childItem"

 2.在子组件的methods中声明一个函数。eg: useInPar:function (str) {console.log(str)}

 2. 在父组件的中声明一个函数,并通过this.$refs.childItem.userInPar来使用子组件中声明的函数。

 父组件:

<template>
 <child-item ref='child' />
  <button @click='useChildFun'></button>
 </template>
 <script>
  ```
 methods() {
    useChildFun:function(){
      this.$refs.child.usedInPar('调用子组件中的方法');
   }
}
 </script>

子组件:

```
 methods () {
  usedInPar(str){
   console.log(str);
  }
 }

没有完整的代码,只有一个用法

总结

以上所述是小编给大家介绍的vue 父组件中调用子组件函数的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery checkbox,radio是否选中的判断代码
Mar 20 Javascript
Javascript在IE和FireFox中的不同表现简析
Dec 03 Javascript
javascript 数组排序函数sort和reverse使用介绍
Nov 21 Javascript
js获取某元素的class里面的css属性值代码
Jan 16 Javascript
跨域资源共享 CORS 详解
Apr 26 Javascript
Node.JS中事件轮询(Event Loop)的解析
Feb 25 Javascript
js中getter和setter用法实例分析
Aug 14 Javascript
JS选取DOM元素常见操作方法实例分析
Dec 10 Javascript
Jquery的Ajax技术使用方法
Jan 21 jQuery
使用post方法实现json往返传输数据的方法
Mar 30 Javascript
通过扫小程序码实现网站登陆功能
Aug 22 Javascript
在Angular项目使用socket.io实现通信的方法
Jan 05 Javascript
通过seajs实现JavaScript的模块开发及按模块加载
Jun 06 #Javascript
小试小程序云开发(小结)
Jun 06 #Javascript
怎么使用javascript深度拷贝一个数组
Jun 06 #Javascript
微信小程序如何使用globalData的方法
Jun 06 #Javascript
详解微信小程序开发(项目从零开始)
Jun 06 #Javascript
vue如何自动化打包测试环境和正式环境的dist/test文件
Jun 06 #Javascript
jQuery+ajax实现批量删除功能完整示例
Jun 06 #jQuery
You might like
PHP面向对象的使用教程 简单数据库连接
2006/11/25 PHP
PHP set_time_limit(0)长连接的实现分析
2010/03/02 PHP
php关于array_multisort多维数组排序的使用说明
2011/01/04 PHP
php 计划任务 检测用户连接状态
2012/03/29 PHP
php 在线导入mysql大数据程序
2015/06/11 PHP
Yii2使用swiftmailer发送邮件的方法
2016/05/03 PHP
Javascript字符串对象的常用方法简明版
2014/06/26 Javascript
node.js require() 源码解读
2015/12/13 Javascript
JavaScript基本语法学习教程
2016/01/14 Javascript
详解mpvue小程序中怎么引入iconfont字体图标
2018/10/01 Javascript
Vue动态路由缓存不相互影响的解决办法
2019/02/19 Javascript
微信小程序网络层封装的实现(promise, 登录锁)
2019/05/08 Javascript
浅析JavaScript 函数防抖和节流
2020/07/13 Javascript
pycharm 使用心得(八)如何调用另一文件中的函数
2014/06/06 Python
Python实现判断并移除列表指定位置元素的方法
2018/04/13 Python
Python实现字符串的逆序 C++字符串逆序算法
2020/05/28 Python
uwsgi+nginx部署Django项目操作示例
2018/12/04 Python
使用 Supervisor 监控 Python3 进程方式
2019/12/05 Python
python 通过邮件控制实现远程控制电脑操作
2020/03/16 Python
离线状态下在jupyter notebook中使用plotly实例
2020/04/24 Python
Python实现捕获异常发生的文件和具体行数
2020/04/25 Python
MxNet预训练模型到Pytorch模型的转换方式
2020/05/25 Python
如何利用Python写个坦克大战
2020/11/18 Python
英国领先的男装设计师服装独立零售商:Repertoire Fashion
2020/10/19 全球购物
构造方法和其他方法的区别?怎么调用父类的构造方法
2013/09/22 面试题
领导的自我鉴定
2013/12/28 职场文书
组织关系转移介绍信
2014/01/16 职场文书
四年级数学教学反思
2014/02/02 职场文书
安全口号大全
2014/06/21 职场文书
公司户外活动总结
2014/07/04 职场文书
篮球兴趣小组活动总结
2014/07/07 职场文书
教师自查自纠工作情况报告
2014/10/29 职场文书
幼儿园教师节活动总结
2015/03/23 职场文书
演讲比赛通讯稿
2015/07/18 职场文书
创业计划书之美容店
2019/09/16 职场文书
Django REST framework 限流功能的使用
2021/06/24 Python