子组件调用父组件的函数,使用$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. linux中怎么结果一页一页输出

    比如sudo apt-cache search php 结果可能有两个屏幕,但是命令执行完毕之后直接就跳到最后面了,我想看第一行怎么办? 可以用管道命令(|)把一个命令的结果作为另一个命令的参数即可. ...

  2. Entity Framework Code-First(22):Code-based Migration

    Code-based Migration: Code-based migration is useful when you want more control on the migration, i. ...

  3. WordCount编码与测试

    1. github项目地址:https://github.com/wwwwu/WordCount 2.PSP表格: PSP2.1 PSP阶段 预估耗时 (分钟) 实际耗时 (分钟) Planning ...

  4. 关于IO流---笔记1

    今日内容介绍1.File2.递归=================================================================================1 I ...

  5. C#和.NET Framework简介

    注:本文大部分借鉴了<果壳中的C#5.0权威指南>,小编也想根据这本书好好梳理一下C#. 序言:C#是一种通用的类型安全且面向对象的编程语言.这种语言的目标是提高程序员的生产力,为此,需要 ...

  6. java多线程系列:通过对战游戏学习CyclicBarrier

    CyclicBarrier是java.util.concurrent包下面的一个工具类,字面意思是可循环使用(Cyclic)的屏障(Barrier),通过它可以实现让一组线程到达一个屏障(也可以叫同步 ...

  7. 【C#】 创建和调用webapi

    二,,通过普通的路由调用,,路径写到http://localhost:29920/api/Players  即   Api/controller  为止

  8. 毛玻璃CHBlurEffect

    1.将需要加入毛玻璃的UI控件传入接口即可 1.1 .h文件 // // 文 件 名:CHBlurEffect.h // // 版权所有:Copyright © 2018年 leLight. All ...

  9. KMP算法不同写法之间区别

    网上之所以有这么多版本的KMP算法,是因为有的人写的是最大长度串版本的,有的人写的是next数组版本的(具体区别看下面博文),有的人写的是next优化版的,有的人写的是未优化的,不同人写的循环方法不同 ...

  10. 剑指offer —— 从尾到头打印链表

    1.问题:输入一个链表,从尾到头打印链表每个节点的值. /** * public class ListNode { * int val; * ListNode next = null; * * Lis ...