子组件调用父组件的函数,使用$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 子组件调用父组件的函数的更多相关文章

  1. vue 子组件调用父组件的方法

    vue中 父子组件的通信: 子组件通过 props: { //子组件中写的. childMsg: { //字段名 type: Array,//类型 default: [0,0,0] //这样可以指定默 ...

  2. Vue子组件调用父组件的方法

    Vue子组件调用父组件的方法   Vue中子组件调用父组件的方法,这里有三种方法提供参考 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法 父组件 <temp ...

  3. Vue 子组件调用父组件 $emit

    <!DOCTYPE html><html>    <head>        <meta charset="utf-8">      ...

  4. Vue中子组件调用父组件的方法

    Vue中子组件调用父组件的方法 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  5. React篇-子组件调用父组件方法,并传值

    react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...

  6. react typescript 子组件调用父组件

    //父组件 import * as React from 'react'import { Input } from 'antd'const Search = Input.Searchimport &q ...

  7. iframe子页面调用父页面javascript函数的方法

    1.iframe子页面调用 父页面js函数 子页面调用父页面函数只需要写上window.parent就可以了.比如调用a()函数,就写成: window.parent.a(); 2.iframe父页面 ...

  8. Vue 子组件调用父组件方法

    父组件内容: <template> <div> <info-wnd ref="infoWnd" @parentClick="wndClick ...

  9. vue中子组件调用父组件里面的数据和方法 父组件调用子组件的数据和方法

    1.子组件直接调用父组件的数据和方法 在父组件father,vue <template> <div> <!-- 父组件里面的数据 --> <p>父组件里 ...

随机推荐

  1. Entity Framework Tutorial Basics(16):Linq-to-Entities Projection Queries

    Linq-to-Entities Projection Queries: Here, you will learn how to write LINQ-to-Entities queries and ...

  2. JavaWeb_内省(Instrospector)

    内省是什么? 开发框架时,经常需要使用java对象的属性来封装程序的数据,每次都是用反射技术完成此类操作过于麻烦,所以sun公司开发了一套API,专门用于操作Java对象的属性. 什么是Java对象的 ...

  3. Linux下boost编译安装

    说明:下面内容仅针对Linux环境(boost官网为:http://www.boost.org/,可从这里下载它的源代码包,这里要求下载.tar.gz包,而非.7z..zip或bz2包). 在当前目录 ...

  4. Gremlin:图遍历语言

    Gremlin简介 Gremlin是Apache TinkerPop 框架下的图遍历语言.Gremlin是一种函数式数据流语言,可以使得用户使用简洁的方式表述复杂的属性图(property graph ...

  5. Fiddler系统监控参数解读

    转自:https://blog.csdn.net/txj236/article/details/38872855 在对系统监控的过程中,发现ClientConnected和ClientBeginReq ...

  6. Java泛型读书笔记 (二)

    关于Java泛型擦除后,继承一个泛型类带来的问题 有如下泛型类Pair: public class Pair<T> { private T second; private T first; ...

  7. 《Linux内核设计与实现》读书笔记(六)- 内核数据结构

    内核数据结构贯穿于整个内核代码中,这里介绍4个基本的内核数据结构. 利用这4个基本的数据结构,可以在编写内核代码时节约大量时间. 主要内容: 链表 队列 映射 红黑树 1. 链表 链表是linux内核 ...

  8. SqlBulkCopy(批量复制)使用方法 && SqlDataAdapter Update

    SqlBulkCopy提供了一种将数据复制到Sql Server数据库表中高性能的方法.SqlBulkCopy 包含一个方法 WriteToServer,它用来从数据的源复制数据到数据的目的地. Wr ...

  9. 在Repeater控件的OnItemDataBound获取数据源记录总数

    Insus.NEt曾经有写过一篇<Repeater控件最后一笔记录高亮显示> ,它的实现是先宣告一个页面级的变量,然后在Data_Binding()方法内获取数据源的记录总数. 本篇是的重 ...

  10. Java为何这么难学?

    在学校的时候,就开始接触Java,哪个时候学的是基础的语法.毕业之后,由于没有找到实习工作且没有从事Java开发,慢慢的就把Java给丢了.从学校出来的几个同事,有的进入了项目实施行业,做了项 目经理 ...