vue $emit

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
<my-com @increase="handleAdd"></my-com> 这里的@increase 是$emit 事件

</div>
<script>
Vue.component("my-com",{
template:‘<div><button @click="handleAdd">+1</button></div>‘,
data (){
return {
counter:0
}
},
methods:{
handleAdd(){
this.counter ++;
this.$emit(‘increase‘,this.counter)   用$emit 向上传递参数
}
}
})
new Vue({
el:"#app",
data:{

},
methods:{
handleAdd(val){
console.log(val)
}
},
components:{

}
})
</script>
</body>
</html>

时间： 2024-10-09 09:24:27

vue $emit的相关文章

Vue总结

vue到底是什么? 一个mvvm框架(库).和angular类似 比较容易上手.小巧mvc: mvp mvvm mv* mvx 面向数据的思想 vue和angular区别? vue--简单.易学 指令以 v-xxx 一片html代码配合上json,在new出来vue实例 个人维护项目 适合: 移动端项目,小巧 vue的发展势头很猛,github上start数量已经超越angular angular--上手难 指令以 ng-xxx 所有属性和方法都挂到$scope身上 angular由google

通过$broadcast或$emit在子级和父级controller之间进行值传递

1 通过$broadcast或$emit在controller之间进行值传递,不过这些controller必须是子级或者父级关系, 2 $emit只能向父级parent controller传递事件event与数据data,$broadcast只能向子级child controller传递event与data,$on用于接收event与data. 3 <script> 4 var myapp=angular.module('myapp',[]); 5 myapp.controller('Sel

vue.js中$emit的理解

官网介绍比较简单 例子:$emit('increment1',[12,'kkk']),直接看是懵逼的有没有,可以先告诉你,就是触发自定义事件increment1(或者函数名吧),[]为参数 上案例 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id=&qu

angularjs的$on、$emit、$broadcast

如何在作用域之间通信呢? 1.创建一个单例服务,然后通过这个服务处理所有子作用域的通信. 2.通过作用域中的事件处理通信.但是这种方法有一些限制:例如,你并不能广泛的将事件传播到所有监控的作用域中.你必须选择是否与父级作用域或者子作用域通信. $on.$emit和$broadcast使得event.data在controller之间的传递变的简单.$emit:子传父 传递event与data$broadcast:父传子 child controller传递event与data$on:监听或接收数

Angularjs中的事件广播-浅谈$broadcast,$emit,$on

Angularjs中不同作用域之间可以通过组合使用$broadcast,$emit,$on的事件广播机制来进行通信 介绍: $broadcast的作用是将事件从父级作用域传播至子级作用域,包括自己.格式如下:$broadcast(eventName,args) $emit的作用是将事件从子级作用域传播至父级作用域,包括自己,直至根作用域.格式如下:$emit(eventName,args) $on用于在作用域中监控从子级或父级作用域中传播的事件以及相应的数据.格式如下:$on(event,dat

基础才是重中之重~Emit动态构建方法(参数和返回值）

回到目录 对于Emit我们知道它的可以动态构建程序集,类型,方法,属性等,或者说只要手动使用C#创建的东西使用Emit也都可以动态创建它们,Emit由于它的特别之处,所以在很多领域得到了广泛的应用,像最近比较火的AOP技术,它最核心的功能就是方法拦截了,我们使用Emit也是可以实现方法拦截功能的,详细可以看大叔这篇文章<Lind.DDD.Aspects通过Plugins实现方法的动态拦截~Lind里的AOP>. 有参数,没有返回值的方法构建与调用 [TestMethod] public voi

angularJs--$on、$emit和$broadcast的使用

$emit只能向parent controller传递event与data $broadcast只能向child controller传递event与data $on用于接收event与data 例子如下 html代码 <div ng-controller="ParentCtrl"> <!--父级--> <div ng-controller="SelfCtrl"> <!--自己--> <a ng-click=&q

AngularJS的学习 $on、$emit和$broadcast的使用

$on.$emit和$broadcast使得event.data在controller之间的传递变的简单. $emit只能向parent controller传递event与data $broadcast只能向child controller传递event与data $on用于接收event与data 请看博客:http://www.it165.net/pro/html/201404/12610.html

ILGenerator.Emit动态 MSIL编程(三)之动态代理

using System; using System.Linq; using System.Reflection; using System.Reflection.Emit; public sealed class DynamicProxy { private static readonly string AssemblyName = "DynamicProxy", ModuleName = "DynamicProxy", TypeName = "Dyna

angular之$broadcast、$emit、$on传值

文件层级 index.html <!DOCTYPE html> <html ng-app="nickApp"> <head> <meta charset="UTF-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"