有一个父组件页面如上,点击新增或者修改都会弹出同一个子组件如下:

  

父组件传参到子组件有两种方式:

一、直接把对象当成参数传给子组件,(看上去更简单,经测试发现一个问题,因为新增时要置空对象的所有信息,甚至包括ID,所有弹出子组件的时候对象信息是展示正确的,但是原来的列表页面,点击的某条数据就是丢失,需要再次刷新或者再次发送请求方可正常);

二、正确的方法应该是父组件传一个ID给子组件也就是弹出框,然后在vue实例被生成后调用这个函数(created)里面通过后端的接口获取对象的详细信息,这样就会避免父组件数据的丢失。

js 父组件向子组件传参的更多相关文章

  1. Layui父页面向子页面传参

    废话不多说!直接上代码! 父窗体js $('.mytable').on('click', '.editRow', function () { var table = $('#table_id_exam ...

  2. 40.VUE学习之--组件之间的数据传参父组件向子组件里传参,props的使用实例操作

    父组件向子组件里传参,props的使用实例 <!DOCTYPE html> <html> <head> <meta charset="utf-8&q ...

  3. js 实现vue—引入子组件props传参

    参考:https://www.cnblogs.com/xiaohuochai/p/7388866.html 效果 html <!DOCTYPE html> <html> < ...

  4. react学习-react父组件给子组件传值与设置传值类型以及是否必传参数

    react 父组件给子组件传参时,父组件直接在引入的子组件内写入要传递的参数即可 <HeaderComponent title={"传递的参数"}></Heade ...

  5. vue 父组件给子组件传值 Vue父组件给子组件传方法 Vue父组件把整个实例传给子组件

    Home.vue <template> <!-- 所有的内容要被根节点包含起来 --> <div id="home"> <v-header ...

  6. Vue 父组件向子组件传值,传方法,传父组件整体

    父子组件传值 1.父组件调用子组件时绑定属性,例如-> :title="title" 2.子组件中在props中声明title:props:['title','msg'] 3 ...

  7. vue.js中父组件触发子组件中的方法

    知识点:vue.js中,父组件的method中,触发子组件中的方法,获得子组件中的定义的属性 (1)子组件 : child_crud.js var html_child_crud= "< ...

  8. VUe.js 父组件向子组件中传值及方法

    父组件向子组件中传值 1.  Vue实例可以看做是大的组件,那么在其内部定义的私有组件与这个实例之间就出现了父子组件的对应关系. 2. 父子组件在默认的情况下,子组件是无妨访问到父组件中的数据的,所以 ...

  9. vue父组件为子组件传值传不过去?vue为数组传值,不能直接用等于的方式,要用循环加push的方式

    父组件为子组件传值不成功,子组件拿不到值,不能直接赋值,要用循环加push的方式赋值.

  10. vue学习之父组件与子组件之间的交互

    1.父组件数据传给子组件 父组件中的msgfather定义数据 在之组件中通过设置props来取得希望从父组件中获得的值 通过设置这两个属性就可以从父组件传数据到子组件 2.子组件传数据给父组件(这里 ...

随机推荐

  1. thrift的使用及遇到的问题

    centos 系统安装官方文档:http://thrift.apache.org/docs/install/centos 一.按该文档安装出现了一系列的问题,记录如下: 1.安装thrift时./bo ...

  2. 最新ssh2构架

    构架要求: 1.最新ssh2jar包. 2.使用全注解. 3.给锁机制 4.缓存. 5.使用权限构架. 6. 前台构架用bootstraps. 今天任务: 搭建php环境.看代码.整理ssh2架构. ...

  3. HDU1532_Drainage Ditches(网络流/EK模板/Dinic模板(邻接矩阵/前向星))

    Drainage Ditches Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  4. STL中各容器之函数总结

    一.序列和关联非共同拥有函数 全部标准库共同拥有函数  (构造,相关属性,迭代器,插入与删除,比較.swap) 当中operator>,operator>=,operator<,op ...

  5. python(11)- 文件处理

    文件操作 1.1 对文件操作流程 打开文件,得到文件句柄并赋值给一个变量 通过句柄对文件进行操作 关闭文件 现有文件如下: 昨夜寒蛩不住鸣. 惊回千里梦,已三更. 起来独自绕阶行. 人悄悄,帘外月胧明 ...

  6. Ffmpeg 获取USB Camera 视频流

    本文讲述的案例是如何通过Ffmpeg实现从USB Camera中获取视频流并将视频流保存到MP4文件. 本文亦适用于从USB Camera 获取视频流并将视频流转发到rtmp服务的案例,二者基本的原理 ...

  7. python datetime获取几分钟、小时、天之前的时间

    import datetime print ((datetime.datetime.now()-datetime.timedelta(days=1)).strftime("%Y-%m-%d ...

  8. BUCK电路工作原理

    Buck电路,也称呼为DC_DC Buck型降压开关电源电路,这种电路结构实际应用也是很多的,电路拓扑结构看下图: 电路中,Q1是开关管,D1是续流二极管,L1就是问题中提到的这个电感器.C1就是问题 ...

  9. String.split()分割字符串方法

    split方法的主要用处就是:分割字符串 split方法返回的是数组类型 主要由以下几种用法: 1.比如有一个字符串var str = "bcadeab";对str使用split方 ...

  10. mysql判断是否等于某个值

    需要在其后面加.toString()方法,其中 flag为字符串类型