vue 子组件调用父组件的函数
子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件。附加参数都会传给监听器回调。
子组件
<template>
<div>
<div class="warp-mark" v-if="bingGoShow">
<img src="../../assets/resources/common/bingo.jpg" alt="">
<div class="again" @click="again">
<img src="../../assets/resources/common/again.png" alt="">
</div>
<div class="nextStep">
<img src="../../assets/resources/common/nextStep.png" alt="">
</div>
</div>
</div>
</template> <script>
export default {
data() {
return{
bingGoShow:true
}
},
methods:{
again(){
this.$emit("onceAgain")
},
}
}
</script>
父组件
<template>
<div>
<mark @onceAgain="again"></mark>
</div>
</template> <script>
import mark from '@/components/mark /mark .vue';
export default {
methods:{
again(){
alert("测试")
}
} } </script>
vue 子组件调用父组件的函数的更多相关文章
- vue 子组件调用父组件的方法
vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...
- Vue子组件调用父组件的方法
Vue子组件调用父组件的方法 Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...
- Vue 子组件调用父组件 $emit
<!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- Vue中子组件调用父组件的方法
Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...
- 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 ...
- iframe子页面调用父页面javascript函数的方法
1.iframe子页面调用 父页面js函数 子页面调用父页面函数只需要写上window.parent就可以了.比如调用a()函数,就写成: window.parent.a(); 2.iframe父页面 ...
- Vue 子组件调用父组件方法
父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...
- vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法
1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...
随机推荐
- js 操作属性,操作内容,
disable=“disable” 让按钮变得不可选 先建一个按钮,让class = ’btn‘ 然后, 添加,修改属性 document.getElementsByClassName('btn')[ ...
- windows VS2013 编译安装QWT6.1和QWTPolar1.1.1
QWT的编译和配置 1. 下载QWT从官网 For getting a snapshot with all bugfixes for the latest 5.2 release: svn expor ...
- loj2436 糖果
传送门 分析 我们知道对于一个不等式a<b可以将其转化为a+1<=b的形式,在知道这个之后我们便可以将5个关系进行差分约束了,具体的建边方式见代码.注意由于每个人都必须有糖,我们把每个人的 ...
- Luogu 4151 [WC2011]最大XOR和路径
你谷又乱评分…… 首先发现答案只有可能是从$1$开始走到$n$,中间绕若干个环,然后使它取到的异或值最大. 这样子的话我们可以随便先取一条路径,强制选择走这条路径,然后把所有的环都丢进线性基里面去,因 ...
- Entity Framework Tutorial Basics(8):Types of Entity in Entity Framework
Types of Entity in Entity Framework: We created EDM for existing database in the previous section. A ...
- 第4章 jQuery中的事件和动画
4.1 jQuery中的事件 4.1.1 加载DOM jQuery就是用 `$(document).ready()方法来代替传统JavaScript的window.onload方法的. 1.执行时机 ...
- 【android】setOnItemClickListener cannot be used with a spinner的错误
错误提示: java.lang.RuntimeException: Unable to start activity ComponentInfo{xx activity}: java.lang.Run ...
- 用MODI OCR 21种语言
作者:马健邮箱:stronghorse_mj@hotmail.com发布:2007.12.08更新:2012.07.09按照<MODI中的OCR模块>一文相关内容进行修订2012.07.0 ...
- 转载-ActiveMQ通过JAAS实现的安全机制
JAAS(Java Authentication and Authorization Service)也就是java认证/授权服务.这是两种不同的服务,下面对其做一些区别:验证(Authenticat ...
- Linux 编写安全巡检脚本
Linux 编写安全巡检脚本 检测/etc/passwd,/etc/shadow文件是否锁定 检测/etc/login.defs配置文件中密码有效期设置是否得当 检查所有用户账户(非系统账户)中是否存 ...