父组件内容:

<template>
<div>
<info-wnd ref="infoWnd" @parentClick="wndClick"></info-wnd>
  </div> </template>
<script>
import infoWnd from './info-wnd';
export default {
data() {
return {
}
},
components: { infoWnd },
methods: {
wndClick() {
console.log('这是父组件的方法');
}
}
}
</script>

子组件Info-wnd.vue组件内容:

<template>
<div @click="divClick">
<span>这是子组件</span>
</div>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
divClick() {
this.$emit('parentClick'); //调用父组件的方法
}
}
}
</script>

Vue 子组件调用父组件方法的更多相关文章

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

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

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

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

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

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

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

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

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

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

  6. vue 子组件调用父组件的函数

    子组件调用父组件的函数,使用$emit(eventName,[...args]),触发当前实例上的事件.附加参数都会传给监听器回调. 子组件 <template> <div> ...

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

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

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

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

  9. vue.js(19)--vue中子组件调用父组件的方法

    子组件是不能直接使用父组件中的方法的,需要进行事件绑定(v-on:自定义方法名="父组件方法名"),然后在子组件中再定义一个方法,使用this.$emit('自定义方法名')语句完 ...

随机推荐

  1. C# 树状图

    效果图: 结构: frmMain层 using hierarchy.BLL; using hierarchy.Model; using System; using System.Collections ...

  2. Homestead的安装配置

    laravel学院教程 : http://laravelacademy.org/post/7658.html 参考博文:https://blog.csdn.net/xyxjn/article/deta ...

  3. STL——string

    C++之string类型详解 之所以抛弃char*的字符串而选用C++标准程序库中的string类,是因为他和前者比较起来,不必担心内存是否足够.字符串长度等等,而且作为一个泛型类出现,他集成的操作函 ...

  4. mysql 两张表的数据设置主外健关联删除

    image_group 主表 image 副表 alter table image add constraint fk_group_idforeign key (group_id)references ...

  5. 如何处理Excel空行问题

    在操作excel的时候, 可能会出现很多的无效数据行. 下面是一个我的简单处理方式 public static bool DataSetToExcel(DataSet dataSet, string ...

  6. cdcq的独立博客

    cdcq的独立博客终于又复活啦,以后就用这个了 地址: http://cdcq.coding.me 现在用的是luogu的博客:https://cdcq.blog.luogu.org/

  7. Linux----------mysql基础

    目录 一.数据库介绍 1.1 数据库的优点 1.2 数据库的基本功能 1.3数据库的类型 1.4 关系型数据的组成 1.5 关系型数据库的常用组件 1.6 SQL语句 1.7 mysql命令使用 1. ...

  8. DevExpress GridControl控件行内新增、编辑、删除添加选择框

    以下为内容以图片居多1234表示点击顺序 先新增一行 操作和新增数据行一样 打开ColumnEdit  选择new ButtenEdit  new上方会出现一个系统命名的button 命名可以更改必须 ...

  9. 手写SpringMVC实现

    设计自己的MVC架构 1.读取配置通过web.xml中加载我们自己写的MyDispatcherServlet和读取配置文件. 2.初始化九大组件只需实现基本的:1).加载配置文件:2).扫描用户配置包 ...

  10. DevExpress中GridControl的重新绑定数据后如何刷新 (转)

    如果对girdcontrol的datasource新添加数据,重新刷新, gridControl1.DataSource = list; gridView1.RefreshData();