vue子组件获取父组件方法
注:以下代码未使用esLint语法检查
父组件:
<template>
<div class="wrapper">
<cp_action @parentMethod="macSelect"></cp_action>
</div>
</template>
<script>
import ../components/action //引入子组件
export default{
components:{
cp_action
},
method:{
macSelect(){
//方法体
alert(123);
}
}
}
</script>
子组件:
<template>
<div class="bet-action">
<span class="mac-select" @click="childMethod">机选</span>
</div>
</template>
<script>
export default{
methods: {
childMethod() {
console.log('请求父组件方法');
this.$emit('parentMethod'); //使用$emit()引入父组件中的方法
}
},
}
</script>
vue子组件获取父组件方法的更多相关文章
- VUE里子组件获取父组件动态变化的值
在VUE里父组件给子组件间使用props方式传递数据,但是希望父组件的一个状态值改变然后子组件也能监听到这个数据的改变来更新子组件的状态. 场景:子组件通过props获取父组件传过来的数据,子组件存在 ...
- 子组件获取父组件数据 propsDown, 父组件获取子组件数据 eventUp
(一) popsDowm 三种方法获取父组件数据:被动获得(1):主动获取(2). 1.被动获得: 父组件:v-bind: 绑定变量参数和方法参数:子组件:props 接收参数.可以在模板中直接使用也 ...
- vue子组件获取父组件的数据
- vue子组件改变父组件的值
1 在父组件的coment绑定事件 <template> <div :class="classObj" class="app-wrapper" ...
- React子组件和父组件通信
React子组件和父组件通信包括以下几个方面: 子组件获取父组件属性:props或者state 子组件调用父组件的方法 父组件获取子组件的属性:props或者state 父组件调用子组件的方法 我们从 ...
- vue 父组件主动获取子组件的数据和方法 子组件主动获取父组件的数据和方法
Header.vue <template> <div> <h2>我是头部组件</h2> <button @click="getParen ...
- vue.js 父组件主动获取子组件的数据和方法、子组件主动获取父组件的数据和方法
父组件主动获取子组件的数据和方法 1.调用子组件的时候 定义一个ref <headerchild ref="headerChild"></headerchild& ...
- Vue 父组件主动获取子组件的值,子组件主动获取父组件的值
父组件主动获取子组件的值 1. 在调用子组件的时候定义一个ref-> ref="header"2. 在父组件中通过this.$refs.header.属性,调用子组件的属性, ...
- vue父组件调用子组件方法、父组件向子组件传值、子组件向父组件传值
一.父组件调用子组件方法 父组件代码 parent.vue <template> <div> <button @click="parentFun" ...
随机推荐
- 【Kickstart】2017 Round (Practice ~ G)
Practice Round Problem A Country Leader (4pt/7pt) Problem B Vote (5pt/8pt) Problem C Sherlock and Pa ...
- java的BigDecimal比较大小
java的BigDecimal比较大小 //前提为a.b均不能为null if(a.compareTo(b) == -1){ System.out.println("a小于b"); ...
- Repeater的使用
1.页面代码 如果要分页,那么页面开头必须写(<%@ Register Src="~/Controls/Page.ascx" TagName="Page" ...
- 2018icpc南京/gym101981 A Adrien and Austin 博弈
题意: n个连续排列的石子,每次只许拿连续的(中间没有空格)的k个,问你谁必胜 题解: 简单博弈,特判总数为0,k=1两种情况,其他情况先拿必胜,方法是拿掉中间的,然后对方怎么拿你镜面拿就行. #in ...
- 用JOptionPane类实现各种对话框
用JOptionPane类实现各种对话框 运行结果: 下面部分参考: JOptionPane类提示框的一些常用的方法 - - ITeye博客 http://847353020-qq-com.itey ...
- STM32例程之USB HID双向数据传输(源码下载)【转】
程序功能 将STM32的USB枚举为HID设备. STM32使用3个端点,端点0用于枚举用,端点1和2用于数据的发送和接收. 端点长度为64,也就是单次最多可以传输64个字节数据. STM32获取上位 ...
- 搭建Linux C语言开发环境
1.操作系统 Windows操作系统:windows 7 and windows 10 2.开发工具和编译工具 开发工具:notpad++ 和 vim 编译工具:Cygwin64 Terminal 3 ...
- JS-监听整个页面上的DOM树变化
# [在线预览](https://jsfiddle.net/1010543618/fyf913t0/) ## 方法 - 使用<Web API 接口>的<MutationObserve ...
- how to catch error in make error message
make 2>&1 | grep error -C 10 -n
- .net报错大全
1.未能加载文件或程序集“Newtonsoft.Json, Version=4.5.0.0"[已解决] 解决方案:https://blog.csdn.net/mzl87/article/de ...