个人理解并整理如下

一、父传子

prop传参

父组件传递参数
<x-scoll :class="red"></x-scoll>

子组件
props:["class"] 子组件接收red(参数)并使用
props还有更严谨的写法 注明参数类型等

二、子传父

子组件绑定并注册事件
v-on:click="change"
change事件里注册事件，this.$emit("changename","传递的内容") //将内容作为参数传递给父组件

父组件绑定子组件注册的事件
<p @changename="update">改变内容</p>

vue父与子通信的更多相关文章

  1. uniapp和vue 父向子传值、传方法及子向父传值。（一看就会超级简约）

    1.父向子传值:父组件在引用子组件时通过自定义属性绑定自身需要传递的值(数据),子组件用props:[  '自定义'  ]接收即可使用(props里数据是只读模式).(简约版:子绑定父的属性并用pro ...

  2. vue 父向子组件传递数据，子组件向父组件传递数据方式

    父组件向子组件传递数据通过props,子组件引入到父组件中,设置一个值等于父组件的数据,通过:bind将数据传到子组件中,子组件中通过props接收父组件的数据,这样就可以使用父组件的数据了,循环组件 ...

  3. vue父传子

    父组件传递数据给子组件用props,父组件中使用子组件,子组件用props接收父组件数据. Home父组件代码: <template> <div> {{test}} <! ...

  4. vue 父到子动态传值 子组件实时渲染

    近期项目中需要一个功能,根据选择不同的 团队片区 id 展示不同的数据,团队id 在父组件  数据在子组件中展示. 根据不同的团队 动态渲染数据总览. 父组件: <Cards ref=" ...

  5. vue学习记录⑤（组件通信-父与子）

    今天我们看一下组件通信. 经过前面几篇文章,我们已经可以构建出完整的单个组件,并利用路由使其串联起来访问了. 但这明显还是不够的.一个页面不可能就是个单组件,一般是由多个组件合成的.正因为如此,组件之 ...

  6. vue小故事之父子(上下级)通信之父传子props

    vue小故事之父子(上下级)通信之父传子props vue 父子(上下级)通信 props  或许你对父子通信有点迷糊,为什么这样那样父子之间就可以通信了,以下通过一个小故事来进行解说,故事模型或许有 ...

  7. vue单文件组件形成父子（子父）组件之间通信（vue父组件传递数据给子组件，子组件传递数据给父组件）

    看了很多文章,官网文档也有看,对父子组件通信说的不是很明白:决定自己总结一下: vue一般都使用构建工具构建项目:这样每个组件都是单文件组件:而网上很多文章都是script标签方式映入vue,组件通信 ...

  8. 总结vue中父向子，子向父以及兄弟之间通信的几种方式

    子向父方式1:通过props,如例子中子组件test1.vue向父组件App.vue传值 App.vue代码 <template> <div id="app"&g ...

  9. vue子父组件的通信

    Element使用的是Vue2.0版本,众所周知在Vue 1.0升级到2.0中去除了$broadcast和$dispatch方法. 1.父组件向子组件传值 a.app.vue父组件 <templ ...

随机推荐

  1. python学习笔记05-列表

    Python3已经不区分整型和长整型 列表: 查  用切片查  [n:n:n] A[1:2]  只能取出一个数  顾头不顾尾 存在步长  可以按步长1取  也可以按设置其他步长取 若要逆序取数  步长 ...

  2. Java基础之断言

    断言是在Java 1.4中引入的.它能让你验证假设.如果断言失败(即返回false),就会抛出AssertionError(如果启用断言). 什么时候使用断言? 断言不应该用于验证输入数据到一个pub ...

  3. 汉诺塔问题（C++版）

    题目描述 Description 约19世纪末,在欧州的商店中出售一种智力玩具,在一块铜板上有三根杆,最左边的杆上自上而下.由小到大顺序串着由64个圆盘构成的塔.目的是将最左边杆上的盘全部移到中间的杆 ...

  4. 贪吃蛇小游戏-----C语言实现

    1.分析 众所周知,贪吃蛇游戏是一款经典的益智游戏,有PC和手机等多平台版本,既简单又耐玩.该游戏通过控制蛇头方向吃食物,从而使得蛇变得越来越长,蛇不能撞墙,也不能装到自己,否则游戏结束.玩过贪吃蛇的 ...

  5. Java模拟双色球彩票

    package practice1; import java.util.Random; import java.util.Scanner; public class Test3 { /** * * 模 ...

  6. tensorflow基础篇-1

    1.使用占位符和变量 import tensorflow as tf import numpy as np #-----创建变量并初始化----------- def first(): my_var= ...

  7. 第8章—使用Spring Web Flow—Spring Web Flow的配置

    Spring中配置Web Flow Spring Web Flow 是 Spring 的一个子项目,其最主要的目的是解决跨越多个请求的.用户与服务器之间的.有状态交互问题,比较适合任何比较复杂的.有状 ...

  8. Zookeeper在Centos7上搭建单节点应用

    (默认机器上已经安装并配置好了jdk) 1.下载zookeeper并解压 $ tar -zxvf zookeeper-3.4.6.tar.gz 2.将解压后的文件夹移动到 /usr/local/ 目录 ...

  9. 一分钟让你学会使用Android AsyncTask

    AsyncTask相信大多数朋友对它的用法都已经非常熟悉,这里记录一下主要是献给那些刚刚接触的Android 或者AsyncTask的同学们,高手请绕道. AsyncTask类是Android1.5版 ...

  10. C/C++ -- Gui编程 -- Qt库的使用 -- Qt5试用

    1.头文件<QtGui>变成了<QtWidgets> 相应<QtGui/***>变成了<QtWidgets/***> 2.QTextCodec::set ...