新建一个组件(即子组件)table.vue

子组件编辑内容如下图所示

子组件通过props获取父组件传递过来的参数,如下图所示,type指明传递到子组件的数据类型,default指定默认值,一般不给

子组件通过事件发射向父组件传递事件及参数,$emit即为发射事件,第一个参数为向父组件传递的事件名,第二个参数为向父组件传递的参数

下面为父组件调用子组件:

在父组件中通过import引入子组件,并注册

父组件调用子组件并传递参数,同时监听子组件事件

父组件处理监听子组件事件

最终效果如下

当然功能还可以继续扩展
---------------------
作者:小前端
来源:CSDN
原文:https://blog.csdn.net/weixin_42300678/article/details/80450972?utm_source=copy

element table 二次封装 父子组件传值 组件通信的更多相关文章

  1. 3.后台配置、环境变量、日志、异常处理、二次封装Response、路由组件

    目录 环境变量 封装logger 封装项目异常处理 二次封装Response模块 路由组件配置 环境变量 dev.py # 环境变量操作:小luffyapiBASE_DIR与apps文件夹都要添加到环 ...

  2. 基于bootstrap table配置的二次封装

    准备 jQuery js css 引用完毕 开始 如果对bootstrap table 的方法与事件不熟悉: Bootstrap table方法,Bootstrap table事件 <table ...

  3. 对jquery的ajax进行二次封装以及ajax缓存代理组件:AjaxCache

    虽然jquery的较新的api已经很好用了, 但是在实际工作还是有做二次封装的必要,好处有:1,二次封装后的API更加简洁,更符合个人的使用习惯:2,可以对ajax操作做一些统一处理,比如追加随机数或 ...

  4. 创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值

    1.创建组件的方法   函数组件   class组件 1.1 函数组 无状态函数式组件形式上表现为一个只带有一个 `render()` 方法的组件类,通过函数形式或者 `ES6` 箭头 `functi ...

  5. 每天一点点之 taro 框架开发 - taro调用组件传值

    1.调用组件 组件文件 import Taro, { Component } from '@tarojs/taro' import { View } from '@tarojs/components' ...

  6. Vue学习笔记【25】——Vue组件(组件间传值)

    父组件向子组件传值 组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据  <script>    // 创建 Vue 实例,得到 ViewModel    var ...

  7. Vue父组件向子组件传值

    父组件向子组件传值 组件实例定义方式,注意:一定要使用props属性来定义父组件传递过来的数据 <script> // 创建 Vue 实例,得到 ViewModel var vm = ne ...

  8. element el-table表格的vue组件二次封装(附表格高度自适应)

    基于vue的el-table表格二次封装组件方法 前言 在公司实习使用vue+element-ui框架进行前端开发,使用表格el-table较为多,有些业务逻辑比较相似,有些地方使用的重复性高,如果多 ...

  9. react初探(二)之父子组件通信、封装公共组件

    一.前言 在组件方面react和Vue一样的,核心思想玩的就是组件,下面举两个组件常用的情景. 场景一:假如我们现在有一个页面包含表格以及多个弹框,这种时候如果将这个页面的业务代码写在一个组件中,那么 ...

随机推荐

  1. CentOS 7下安装samba

    Samba是一种软件,它可以运行在非Windows平台上,比如UNIX, Linux, IBM System 390, OpenVMS或其他操作系统.Samba使用安装在主机上的TCP/IP协议.当正 ...

  2. JVM监控和调优常用命令工具总结

    JVM监控和调优 在Java应用和服务出现莫名的卡顿.CPU飙升等问题时总是要分析一下对应进程的JVM状态以定位问题和解决问题并作出相应的优化,在这过程中Java自带的一些状态监控命令和图形化工具就非 ...

  3. 【CF480D】Parcels DP

    [CF480D]Parcels 题意:有一个栈,有n个物品,每个物品可以选或不选.如果选了第i个物品,则获得$v_i$的收益,且第i个物品必须在$in_i$时刻入栈,$out_i$时刻出栈.每个物品还 ...

  4. postgresql修改数据库编码

    update pg_database set encoding = pg_char_to_encoding('UTF8') where datname = 'your_database'; 先用 \e ...

  5. vue+axios如何操作数据交互

    参考: http://www.php.cn/js-tutorial-403543.html

  6. poj 3304

    我老人家要开始玩几何了! .这个题有点自闭. 就是问是否存在一条直线经过所有了n条线段,(有交点). 我老人家愚昧不可救药,想了想决定先求出来 这两条直线的交点,然后看是否在线段上.但是一直写不对.. ...

  7. Windows 平台下局域网劫持测试工具 – EvilFoca

    简介 安全测试工具可能含有攻击性,请谨慎适用于安全教学及学习用途,禁止非法利用! EvilFoca是Windows环境下基于.NET FrameWork的一款轻量级的劫持测试工具.与BackTrack ...

  8. 浅谈编码Base64、Hex、UTF-8、Unicode、GBK等

    网络上大多精彩的回答,该随笔用作自我总结: 首先计算机只认得二进制,0和1,所以我们现在看到的字都是经过二进制数据编码后的:计算机能针对0和1的组合做很多事情,这些规则都是人定义的:然后有了字节的概念 ...

  9. HTML经典模板总结(地址)

    HTML经典模板总结 地址:http://download.csdn.net/tag/html%E6%A8%A1%E6%9D%BF?from=singlemessage

  10. Spark Streaming实战演练

    一.spark streaming简介 Streaming是一种数据传输技术,它把客户机收到的数据变成一个稳定连续的流,源源不断的输出,使用户听到的声音和图像十分稳定,而用户在整个文件传输完成开始前就 ...