vue.js(19)--vue中子组件调用父组件的方法
子组件是不能直接使用父组件中的方法的,需要进行事件绑定(v-on:自定义方法名="父组件方法名"),然后在子组件中再定义一个方法,使用this.$emit('自定义方法名')语句完成父组件中方法到子组件中的调用,最后直接调用子组件中定义的方法即可。
<div class="app">
<mycom v-on:func="parentshow"></mycom>
<!-- 通过v-on:绑定方法将父组件中的方法绑定到func,
然后在子组件中定义一个方法(this.$emit('func'))将func传递给子组件,
这样子组件就可以通过自己的方法来调用父组件的方法 -->
</div>
<template id="cmp">
<div>
<a href="#" @click.prevent="show">快点我</a>
</div>
</template>
<script>
var vm = new Vue({
el:'.app',
data:{
msg:'我是父组件的方法'
},
methods:{
parentshow(){
alert(this.msg)
}
},
components:{
mycom:{
template:'#cmp',
methods:{
show(){
this.$emit('func')//通过此方法在子组件建立方法来调用父组件中的方法
}
}
}
}
})
</script>
vue.js(19)--vue中子组件调用父组件的方法的更多相关文章
- Vue中子组件调用父组件的方法
Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- Vue子组件调用父组件的方法
Vue子组件调用父组件的方法 Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...
- Vue 子组件调用父组件 $emit
<!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- vue 子组件调用父组件的方法
vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...
- vue 子组件调用父组件的函数
子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件.附加参数都会传给监听器回调. 子组件 <template> <div> ...
- React篇-子组件调用父组件方法,并传值
react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...
- react typescript 子组件调用父组件
//父组件 import * as React from 'react'import { Input } from 'antd'const Search = Input.Searchimport &q ...
- vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法
1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...
- Vue 子组件调用父组件方法
父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...
随机推荐
- SSM图片
非关系型数据,redis,mongoDB关系型数据,mysql,oracle 1.springmvc+spring+mybatis1.导入jar2.书写配置xml(applicationContext ...
- 舞蹈课(dancingLessons)
有n个人参加一个舞蹈课.每个人的舞蹈技术由整数ai来决定.在舞蹈课的开始,他们从左到右站成一排.当这一排中至少有一对相邻的异性时,舞蹈技术相差最小的那一对会出列并开始跳舞.如果相差最小的不止一对,那么 ...
- 果蝇优化算法(FOA)
果蝇优化算法(FOA) 果蝇优化算法(Fruit Fly Optimization Algorithm, FOA)是基于果蝇觅食行为的仿生学原理而提出的一种新兴群体智能优化算法. 果蝇优化算法(FOA ...
- C++ 对象间通信框架 V2.0 ××××××× 之(五)
类定义: ======================================================================= // MemberFuncPointer.h: ...
- 在 mac 系统上安装 python 的 MySQLdb 模块
在 mac 系统上安装 python 的 MySQLdb 模块 特别说明:本文主要参考了Mac系统怎么安装MySQLdb(MySQL-Python) 第 1 步:下载 MySQL-python-1.2 ...
- influxDB 1.3 中文文档
influxDB是一个旨在处理高并发写入和查询负载的时序数据库,它是TICK框架的第二部分,influxdb用于任何包含大量时序数据应用的后台存储,包括Devops监控.应用指标数据.物联网传感器数据 ...
- jetty 启动时出现的问题
启动时出现: 1. NoClassDefFoundError: javax/xml/registry/infomodel/User 是需要导入jaxr-api包, <dependency> ...
- C/C++中动态内存分配
代码段:用来存放程序执行代码的一块内存区域.这部分内存大小在程序运行前已经知道,通常属于只读,其中包括只读的字符串常量,不可改变 BBS段:用来存放存放程序中未初始化的全局变量及静态变量,属于静态内存 ...
- sql分别用日期、月、年 分组 group by 分组,datepart函数
标签: datepart函数sql分别用日期月年 分组group by 分组 2013-12-26 15:31 20764人阅读 评论(1) 收藏 举报 分类: SQL Server(21) 版权声明 ...
- ijkplayer阅读学习笔记之从代码上看播放流程
http://blog.csdn.net/i_do_can/article/details/51374732