extjs6学习(5)

2019-03-09 11:58

});

scope: this,controller 2种定义查找范围,在控制器or 当前对象中,默然controller

controller:说明login 方法在ExtFrame.view.login.Login类的controller中查找 this:说明login 方法在ExtFrame.view.login.Login类中实现查找

18. 查找对象的方法种类

控制器中

1、 lookupReference【史超】

window 中

xtype: 'form',//父窗体

reference: 'form',定义 reference

控制器方法中:

var form = this.lookupReference('form'); if (form.isValid()) {}

2、 up or down itemId【郑冰 点击button】

window中:

xtype : 'form',

itemId : 'gridFrom',

控制器方法中:

saveEmployee : function(btn) { var win = btn.up(\); 标签类

var gridFrom = win.down('form'); 标签类

var currentId = win.down('#id').getValue(); 3、 getView【史超】

在控制器 方法 中:

this.getView().得到控制器所在的容器 (即父容器) down('#hrEmployeeGrid').store.load(); 4、 adfa 5、

itemId

19. 主界面+ 弹出窗口回调示意图

主控制器 方法: Ext,create('extFrame.view.udp.hr.employee.windows.EmployeeWin',{listeners: { 设置win的监听方法 scope: this, saveSuccess: 'saveSuccessed' } });'saveSuccessed':function 回调函数弹出框 存在窗口级的监听方法 saveSuccess: 弹出框 控制器 方法:this.fireViewEvent('saveSuccess'); 触发窗口级的方法 2触发

主界面控制器:

// 保存成功后的回调

saveSuccessed: function() { },

//新增方法的弹出框

addRecord : function() { },

this.window = Ext

.create('extFrame.view.udp.hr.employee.windows.EmployeeWin',

{

listeners: {

// Ext.getCmp('extFrame_view_udp_hr_employee_Index') this.getView().down('#hrEmployeeGrid').store.load();

this.window.destroy(); // alert('lrllrl');

scope: this,

saveSuccess: 'saveSuccessed'//this-当前控制器范围内 }

}

);

this.window.setTitle('新增员工'); this.window.show();

的saveSuccessed

弹框控制器的,保存方法:

saveEmployee : function(btn) {

var curController = this; 在嵌套使用时,不能用this,定义临时变量

Ext.Ajax.request({ // 判断编码是否重复

success : function(response, opts) {

if (response.responseText == 'true') {

if (gridFrom.form.isValid()) {

gridFrom.form.doAction('submit', {

url : url, method : 'POST',

success : function(form, action) {

if (action.result.msg == \操作成功!\) {

url : udp.getRootPath()+'/employee/verifyCode', method : 'POST', params : { },

'code' : win.down('#code').value, 'id' : win.down('#id').value

curController.fireViewEvent('saveSuccess'); 触发弹框事件,回调主界面控制

器方法

20. 主题样式控制

资源都在根下,watch 或build后,会将应用需要的资源放到build对应的目录下

App.json更改后,需要

编译一下,生成

页面加载需要的样式文件

要点:在app watch 状态下,文件有变化,会动态编译,并通知浏览器更新页面 http://localhost:1841/?platformTags=fashion:true

使用fashion参数,可以动态调试样式,随时看到结果(原理:websocket链接服务器,当服务器端有变化时,会通知客户端刷新)

http://www.cnblogs.com/sunjie9606/p/5108943.html

当然,现在也可以使用这种方式来修改modern工具包的主题。运行以下命令: 1.sencha app watch modern

在浏览器打开以下url将打开modern工具包:

1.http://localhost:1841/?toolkit=modern&platformTags=fashion:true 修改以下文件:

modern/sass/var/Application.scss 对应终端下 全局变量

21. 自定义主题

http://blog.csdn.net/tianxiaode/article/details/46927373 创建、编译、发布

1、 项目目录下,执行

sencha generate theme theme-spotifext

sencha generate theme --extend theme-neptune theme-neptune-red有继承关系 这将在工作区(workspace)的packages/local文件夹中创建一个主题包。它包含有一个sass/var文件夹,用来存放Sass样式表的变量文件,这些文件会先编译。它还包含一个sass/src文件夹,用来存放使用了混入(mixins)和CSS规则的Sass样式表文件,这些文件的编译时间在后,以便使用预定义的变量。主题包还包含了一个resources文件夹,它可以用来存放诸如图片或字体等文件。包里还包含一个package.json文件,它保存了主题包的元数据,例如,它将包的类型设置为“主题”。此外,还可以编写联系信息和描述。这里还有一件事需要去做,就是创建新的海卫一主题的变种,需要将extend行修改为: \

注:有继承关系

2、 切换主题 改app.json中

\

下一步要做的是使用sencha app build或sencha app build development来生产应用程序(只是生成主题而不是整个应用程序),然后继续。 3、 定义自己的样式

D:\\MyEclipseWebNew\\dl-udp1.0\\WebContent\\extFrame\\packages\\local\\theme-spotifext\\sass\\var定义 全局 组件变量(全局的)和 分组件变量(也是全局的),如下


extjs6学习(5).doc 将本文的Word文档下载到电脑 下载失败或者文档不完整,请联系客服人员解决!

下一篇:素质拓展活动策划书

相关阅读
本类排行
× 注册会员免费下载(下载后可以自由复制和排版)

马上注册会员

注:下载文档有可能“只有目录或者内容不全”等情况,请下载之前注意辨别,如果您已付费且无法下载或内容有问题,请联系我们协助你处理。
微信: QQ: