vue 子组件传递数据跟父组件
子组件 <body>
<div v-on:click="test"></div> <script>
export default {
data(){
return {
data:"我是子组件传递数据给父组件"
}
},
methods:{
test:function(){
this.$emit('list',this.data) // $emit 有2个参数 第一个是监听父组件事件，第二个是传递的数据
}
} }
</script>
</body> //父组件 <body>
<child v-on:list="events"></child>
<script>
import child from "./child"
export default{
methods:{
events:function(data){
console.log(data) // data就是子组件传递过来的参数
}
},
components:{
child
}
}
</script>
</body>
vue 子组件传递数据跟父组件的更多相关文章
- Vue子组件传递数据给父组件
子组件通过this.$emit(event,data)传递数据到父组件 以下是例子: father.vue 父组件 <template> <div> <child @ne ...
- vue单文件组件形成父子（子父）组件之间通信（vue父组件传递数据给子组件，子组件传递数据给父组件）
看了很多文章,官网文档也有看,对父子组件通信说的不是很明白:决定自己总结一下: vue一般都使用构建工具构建项目:这样每个组件都是单文件组件:而网上很多文章都是script标签方式映入vue,组件通信 ...
- vue $emit $on 从子组件传递数据给父组件
原理是: 子组件使用$emit发送数据,父组件使用$on,或者v-on绑定, 来监听子组件发送的数据. 子组件: <button @click="sendChildData" ...
- vuejs利用props，子组件修改父组件的数据，父组件修改子组件的的数据，数据类型为数组
博文参考 传送们点一点 父组件: <template> <div> <aa class="abc" v-model="test" ...
- layui中从子窗口传递数据到父窗口,第三个子弹层的值传给第二个弹层
最近做一个项目的需要多个弹层,每个弹层中还需要数据传递, 经过测试,以下方法三个弹层才有效,如果只是有两个弹层,请用其它方法 大概如图,看图自己应该明白 如何在在b页面选择好的值传给a页面的问题,这个 ...
- 前端（二十二）—— vue组件：局部组件、全局组件、父组件数据传到子组件、子组件数据传到父组件、父子组件实现todoList
Vue组件 一.组件介绍 每一个组件都是一个vue实例 每个组件均具有自身的模板template,根组件的模板就是挂载点,根组件也可以显式书写模板,会替换掉挂载点 每个组件模板只能拥有一个根标签 子组 ...
- vue 父向子组件传递数据，子组件向父组件传递数据方式
父组件向子组件传递数据通过props,子组件引入到父组件中,设置一个值等于父组件的数据,通过:bind将数据传到子组件中,子组件中通过props接收父组件的数据,这样就可以使用父组件的数据了,循环组件 ...
- VUE中父组件向子组件传递数据 props使用
VUE中,子组件是不能直接访问父组件的数据(一般来说,当然如果你要破坏原则也是可以),如下< <body> <div id="fathercomponent" ...
- Vue : props 使用细节(父组件传递数据给子组件)
props使用细节 在Vue.js中我们可以使用 props 实现父组件传递数据给子组件,下面我们总结一下props的使用细节 1.基础类型检查 2.必填数据 3.默认值 4.自定义验证函数 其中每一 ...
随机推荐
- 006-线程同步解决【ReentrantLock】
一.解决方案 004-线程同步问题引出.同步问题解决.死锁.生产者与消费者 通过以上文章可知,通过原子性AtomicLong .以及内部锁(synchronized)机制可以解决线程安全问题.以下是一 ...
- django高级之点赞、文章评论及上传文件
目录: 点赞 文章评论 上传文件 保留页面条件 一.点赞 1.所用技术: django model F查询 js应用:$(function () {}); 为文件加载完成执行ready() 方法.等同 ...
- 使用distcp并行拷贝大数据文件
以前我们介绍的访问HDFS的方法都是单线程的,Hadoop中有一个工具可以让我们并行的拷贝大量数据文件,这个工具就是distcp. distcp的典型应用就是在两个HDFS集群中拷贝文件,如果两个集群 ...
- 跟我学Makefile（六）
shell 函数 :和反引号“`”是相同的功能 . shell 函数把执行操作系统命令后的输出作为函数返回. contents := $(shell cat foo) files := $(shell ...
- 解决:对COM 组件的调用返回了错误 HRESULT E_FAIL
调用SHDOCVW(web浏览器) COM组件的时候,返回了错误 HRESULT E_FAIL.总结如下: 1. 在控制面板--->管理工具--->服务 中,开启Distributed T ...
- ACM ICPC, JUST Collegiate Programming Contest (2018) Solution
A:Zero Array 题意:两种操作, 1 p v 将第p个位置的值改成v 2 查询最少的操作数使得所有数都变为0 操作为可以从原序列中选一个非0的数使得所有非0的数减去它,并且所有数不能 ...
- Cup fungus in Corvobado Nation Park,Costa Rica
- linux 服务器部署的web项目存入数据库的时间不正确
在linux获取当前时间 date 获取的时间是正常的 ----- java写了个测试类 public class TestDate { public static void main(String[ ...
- 常用php操作redis命令整理（二）哈希类型
HSET将哈希表key中的域field的值设为value;如果field是哈希表中的一个新建域,并且值设置成功,返回1;如果哈希表中域field已经存在且旧值已被新值覆盖,返回0. <?php ...
- js输出大段html文档简便方法
原文链接:https://zhidao.baidu.com/question/586477237.html 把要输出的html全部写在某个id中,然后复制过去,你想放多少都行 <script t ...