salesforce lightning零基础学习(九) Aura Js 浅谈二: Event篇
上一篇介绍了Aura Framework中 Component类的部分方法,本篇将要介绍Event常用的方法。
1. setParam (String key , Object value):设置事件的param,此项设置不会修改已经被触发的事件。我们在创建事件的时候可以同时声明attribute,在我们fire事件以前,可以对这些attribute设置值,其中key为attribute的name,value部分即为attribute的value。
2.setParams (Object config):设置一组事件的param键值对。参数格式类似于{param1:value1 , param2:value2}。
3.fire (Object params): 触发事件,params是可选项,如果params设置了键值对,则这里的键值对则会覆盖原有的键值对。
4.getParam (String name): 获取params中指定name对应的value值。event fire以后,在对应的handler中可以通过getParam获取相关param的value值。
5.getParams (): 获取params的所有键值对的集合。
6.getEventType (): 获取事件类型, COMPONENT/APPLICATION。
7.getName (): 获取注册的事件的名称。<aura:registerEvent name="TestEvent" type="c:TestComponentEvent"/> ,则此方法返回 TestEvent
8.getSource ():获取事件对应的事件源。事件操作主要分成三部分,事件源,事件,事件handler。通过事件可以获取到对应的数据源。
9.getPhase (): 获取事件阶段。 capture/bubble/default.
10.getType (): 获取注册事件的类型。<aura:registerEvent name="TestEvent" type="c:TestComponentEvent"/> ,则此方法返回 c:TestComponentEvent
11.pause ():暂停事件触发,当调用resume方法后才会继续进行事件触发的执行。
12.resume():继续进行事件触发的执行。
13.stopPropagation ():设置事件是否可以冒泡。调用此方法后将会停止后续的事件阶段的执行。
其他方法或者上面方法的详细描述可以自行查看Event类的方法介绍。下面进行简单的demo。
1.TestComponentEvent.evt: 创建一个Component类型的事件,包含两个String类型的参数;
<aura:event type="COMPONENT" description="test component event">
<aura:attribute name="testAttribute1" type="String"/>
<aura:attribute name="testAttribute2" type="String"/>
</aura:event>
2.TestComponent.cmp: 创建一个Component,注册此事件并设置此事件对应的handler,在init函数中触发此事件;
<aura:component>
<aura:registerEvent name="TestComponentEvent" type="c:TestComponentEvent"/>
<aura:handler name="TestComponentEvent" action="{!c.testComponentHandler}"/>
<aura:attribute name="testA1" type="String"/>
<aura:attribute name="testA2" type="String"/>
<aura:handler name="init" value="{!this}" action="{!c.initHandler}"/>
{!v.testA1 + v.testA2}
</aura:component>
3.TestComponentController.js : init函数中触发事件,触发事件设置相关的attribute值以及打印出相关的属性
({
initHandler : function(component, event, helper) {
var testEvent = component.getEvent('TestComponentEvent');
testEvent.setParam('testAttribute1','test value 1');
testEvent.setParam('testAttribute2','test value 2');
testEvent.fire({'testAttribute1' : 'test value 1 updated'});
},
testComponentHandler : function(component,event,helper) {
component.set('v.testA1', event.getParam('testAttribute1'));
component.set('v.testA2',event.getParam('testAttribute2'));
console.log('type : ' + event.getType());
console.log('event phase : ' + event.getPhase());
console.log('event name : ' + event.getName());
console.log('event params : ' + event.getParams());
console.log('event param 1 : ' + event.getParam('testAttribute1'));
console.log('event type : ' + event.getEventType());
}
})
结果展示:
总结:此篇主要介绍了一些Event类常用的方法,详情可以自行参看官方提供的文档。篇中有问题的欢迎指出,有不懂得欢迎留言。
salesforce lightning零基础学习(九) Aura Js 浅谈二: Event篇的更多相关文章
- salesforce lightning零基础学习(八) Aura Js 浅谈一: Component篇
我们在开发lightning的时候,常常会在controller.js中写 component.get('v.label'), component.set('v.label','xxValue'); ...
- salesforce lightning零基础学习(十) Aura Js 浅谈三: $A、Action、Util篇
前两篇分别介绍了Component类以及Event类,此篇将会说一下 $A , Action以及 Util. 一. Action Action类通常用于和apex后台交互,设置参数,调用后台以及对结 ...
- salesforce lightning零基础学习(十一) Aura框架下APP构造实现
前面的一些lightning文章讲述了aura的基础知识,aura封装的常用js以及aura下的事件处理.本篇通过官方的一个superbadge来实现一个single APP的实现. superbad ...
- salesforce lightning零基础学习(十四) Toast 浅入浅出
本篇参考: https://developer.salesforce.com/docs/component-library/bundle/force:showToast/specification h ...
- salesforce lightning零基础学习(十七) 实现上传 Excel解析其内容
本篇参考: https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader https://github.com/SheetJS/sheetjs ...
- salesforce lightning零基础学习(十五) 公用组件之 获取表字段的Picklist(多语言)
此篇参考:salesforce 零基础学习(六十二)获取sObject中类型为Picklist的field values(含record type) 我们在lightning中在前台会经常碰到获取pi ...
- salesforce lightning零基础学习(二) lightning 知识简单介绍----lightning事件驱动模型
看此篇博客前或者后,看一下trailhead可以加深印象以及理解的更好:https://trailhead.salesforce.com/modules/lex_dev_lc_basics 做过cla ...
- salesforce lightning零基础学习(一) lightning简单介绍以及org开启lightning
lightning对于开发salesforce人员来说并不陌生,即使没有做过lightning开发,这个名字肯定也是耳熟能详.原来的博客基本都是基于classic基于配置以及开发,后期博客会以ligh ...
- salesforce lightning零基础学习(三) 表达式的!(绑定表达式)与 #(非绑定表达式)
在salesforce的classic中,我们使用{!expresion}在前台页面展示信息,在lightning中,上一篇我们也提及了,如果展示attribute的值,可以使用{!v.expresi ...
随机推荐
- json-server使用及路由配置
1.先安装node.js,node.js中包含了json-server模块 2.在angular-hello/src/app/data-base.json文件中,编辑json格式的服务数据, { &q ...
- nc 画界面,触发效果(第一种)
package nc.ui.hzctr.sellctr.action; import java.awt.BorderLayout; import java.awt.Dimension; import ...
- AJAX html 传输json字符串&&巧妙运用eval()来解析返回的JSON字符串
1.AJAX html 传输json字符串: js方法如下: function saveRetYwlsh(){ var xmbh = document.getElementById("xmb ...
- activeMq-3 Spring整合activeMq
与jdbcTemplate相似的是,Spring也提供了JmsTemplate 生产者使用JmsTemplate生产消息,消费者实现一个监听器用于获取消息 项目用maven构建,jdk1.8, 文末提 ...
- .net amr格式文件转换成mp3格式文件的方法
前言:winform端对于音频文件的格式多有限制,大多数不支持amr格式的文件的播放.但是,手机端传过来的音频文件大多数是amr格式的文件,所以,要想在winform客户端支持音频文件的播放,可以通过 ...
- python datetime模块用法
1. 创建naive(无时区信息)的datetime对象 import datetime dt_utc = datetime.datetime.utcnow() dt_utc # datetime.d ...
- SQL笔试基础
SQLSERVER服务器中,给定表table1 中有两个字段 ID.LastUpdateDate,ID表示更新的事务号,LastUpdateDate表示更新时的服务器时间,请使用一句SQL语句获得最后 ...
- 20175316盛茂淞 2018-2019-2 《Java程序设计》第3周学习总结
20175316盛茂淞 2018-2019-2 <Java程序设计>第3周学习总结 教材学习内容总结 1.1.编程语言的几个发展阶段: 面向机器语言 面向过程语言 面向对象语言 2.1.类 ...
- href=#与href=javascript:void(0)的区别
#"包含了一个位置信息,默认的锚点是#top 也就是网页的上端 而javascript:void(0) 仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#可是跳动到了页首,而 ...
- mui.init()和mui.plusReady()
1.每个用到mui的页面都调用下mui.init.2.如果需要使用大H5+对象,就写到plusReady中,如plus对象. HTML5+扩展api是针对手机APP的,只有才手机应用(比如手机浏览器) ...