Sukla的博客

转载自：http://www.jeeboot.com/archives/1227.html本章涵盖了高级组件，比如 tree 和 data view。它将为读者呈现一个示例项目为 图片浏览器，它使用 tree 和 data view 组件。以下是本章将要讨论的主题：TreesData views拖放图片浏览器 — 一个示例项目本章的主要目标是探索 tree pa

1，想实现不刷新页面，但是更新数据，尝试了一下，效果如下；2，代码如下，用的6.2以上/** * Created by Sukla on 2017/9/19. */Ext.define('app.view.common.dataBind.ShowDataBind',{ extend:'Ext.panel.Panel', title:'数据双向绑定,两个输入框共享一

1，返回的n条数据中的m条数据设置了被选中，想在初始化的时候让这一行数据被选中；2，效果图如下3，测试数据[ { 'name':'张三', price:'100块', change:'no', code:'1' }, { 'name':'李四', price:'1000块', change:'yes',

gridPanel上写sortableColumns:false,

1，效果如图2，index.html 中引入3，view/** * Created by Sukla on 2017/12/19. */Ext.define('app.view.common.baiduMap.BaiduMapView', { extend: 'Ext.panel.Panel', alias: 'widget.baidu-map',

1，在页面的 controller 里面创建了一个弹窗 window window里面有 button 按钮 想要在 这个button 的 点击事件 里面 使用 页面的 controller 的 this 上下文2，在 Ext.create(Ext.window.Window',{}) 里面 在 button 的 handler 里面 调用 一个 controller 里面的方法 比如 me.

1，父组件 viewModel 中有字段 {key1:a,key2:b,key3:c}2，子组件 viewModel 中有字段 {key1:d,key2:e}3，在子容器中 bind key1 key2 key3 结果为 d e c 4，子容器会在最近的viewModel 中找数据 最近的 viewModel 中如果没找到 就会去下一个 最近 的 viewModel 中去获取

1，效果如图2，思路 将左侧每一块锚点内容区域的 reference 与 右侧 的 导航栏的 每一个节点的 itemId 对应 点击导航栏节点的时候 获取 响应的 锚点区域相对于容器顶部的距离 然后设置视窗的滚动距离3，主要代码/** * Created by Sukla on 2017/12/6. */Ext.define('app.view.common.anchor

1，效果如图2，思路实现左右滚动 其实元素并没有滚动 只是调整了 viewModel 中的数据的位置 在左右两个按钮的点击事件 分别调整 viewModel 中的数组 是往前位移 还是往后 位移 点击数据块 显示 图片 是在点击的时候 改变图片块绑定的图片的路径 同时 给被点击的数据块切换样式 滚动的时候 也分别将前面或者后面的数据块的样式切换了 3，主要代码/

1，效果如下2，思路页面使用了 border 布局 west 就是 菜单所在的区域 使用 fit 布局 这样就只会显示第一个子元素其实有两个 子元素第二个 子元素 是一个 默认的 Ext.tree.Panel 给它设置一个 autoLoad 的 store 获取菜单的数据 west 的第一个组件 也就是 给用户看的这个组件 我叫它镜像菜单 当 treePanel

1，效果如图2，思路 使用 grid 的 sort 方法3，代码/** * Created by Sukla on 2017/12/26. */Ext.define('app.view.common.gridSort.GridSortView', { extend: 'Ext.grid.Panel', alias: 'widget.gridSortView

1，添加 header:false

1,效果如下2,在grid的单元格上设置的listeners onmouseleave 不起作用 就用了js的onmouseeleave 代码如下/** * Created by Sukla on 2018/1/8. */Ext.define('GridCellToggleTipsView',{ extend:'Ext.grid.Panel', alias

1，效果如图2，思路通过viewModel 绑定data 和 store  切换数据即可3，view/** * Created by Sukla on 2017/12/25. */Ext.define('app.view.common.tabViewModel.TabViewModelView', { extend: 'Ext.panel.Panel',

1,找到.sencha文件夹 改之

1，ext新建主题sencha generate theme mytheme命令报错，是关于local的；2，app.json中的requires里面引入的local注释掉，主题创建完了再解开

1，更新了ext代码，跑的时候报错，后来发现是清除缓存D:\Tomcat\apache-tomcat-8.0.12\work\Catalina\localhost\项目名,的时候tomcat正在运行，清除缓存的时候tomcat的线程还在，所以没有清掉；2，清除tomcat缓存的时候要先把tomcat关掉，然后清除缓存，然后重启汤姆猫；

1，要实现选中行在grid之间移动换行；2，我的思路是把里面的数据拿出来之后，调整到位置，然后在显示出来；3，效果如图；4，代码如下dataButtonWin:function(){ var leftgriddata=[]; leftgriddata=[ {name: 'Rec 0', column1: '0', column2: '0'

转载自：http://www.jeeboot.com/archives/1225.html本章将探索 Ext js 的高级组件 grid 。还将使用它帮助读者建立一个功能齐全的公司目录。本章介绍下列几点主题：基本的 grid排序渲染器过滤分页单元格编辑行编辑分组分组 grid（pivot grid）公司目录 —一个示例项目grid 组件是 Ext JS 中最强大

转载自：http://www.jeeboot.com/archives/1222.html本章探索 Ext js 中处理数据可用的工具以及服务器和客户端之间的通信。在本章结束时将写一个调用 RESTful 服务的例子。下面是本章的内容：模型SchemaStores代理过滤和排序做一个基于 RESTful 的小项目Model（模型）一个模型包含字段，字段类型，

转载自：http://www.jeeboot.com/archives/1219.html在本章中，你将学习到一些 Ext js 基础组件的使用。同时我们会结合所学创建一个小项目。这一章我们将学习以下知识点：熟悉基本的组件 – 按钮，文本框，日期选择器等等表单字段的校验菜单和工具栏设计一个表单计算器程序– 本章的示例项目本章的主要目的是创建一个表单设

转载自：http://www.jeeboot.com/archives/1217.html在下一章我们会构建一个示例项目，而在这之前，你需要学习一些在 Ext js 中的核心概念，这有助于你更容易理解示例项目。这一章我们将学习以下知识点：类系统，创建和扩展类事件Ext JS 对象的查询容器布局class system(类系统)Ext JS 提供了

转载自：http://www.jeeboot.com/archives/1211.html前言本来我是打算自己写一个系列的 ExtJS 6 学习笔记的，因为 ExtJS 6 目前的中文学习资料还很少。google 搜索资料时找到了一本国外牛人写的关于 ExtJS 6 的电子书 [Ext js 6 By Example]。这份资料在 PACKT上卖 35.99 刀的，当然

转载自：http://www.jeeboot.com/archives/1231.html本章重点在 ExtJS 应用的主题和响应式设计。主要有以下几点内容：SASS 介绍和入门主题响应式设计SASS 介绍和入门SASS (Syntactically Awesome Stylesheets) 是一个样式语言，当你使用 SASS 代替 CSS 来写样式，之后

转载自：http://www.jeeboot.com/archives/1229.html本章中将探索在 ExtJS 中使用不同类型的图表并使用一个名为费用分析的示例项目结束本章所学。以下是将要所学的内容：图表类型条形图 和 柱形图 图表区域 和 折线 图表饼图 图表3 D 图表费用分析 – 示例项目图表在第一章中提过，我说 ExtJS 是一站式的几乎能满足

1.当前对象的父对象(上级对象) this.ownerCt: 2.当前对象的下一个相邻的对象 this.nextSibling(); 3.当前对象的上一个相邻的对象 this.previousSibling(); 4.当前容器中的第一个子对象 this.get(0); this.items.first(); 5.当前容器的最后一个子对象 th

1,我的项目是直接从别的ext样例项目copy过来的，版本为6.0，样例代码的主题是build production之后的代码，而且项目中缺少.sencha文件夹,index.html变为index.jsp2,思路是这样的，我发现当前项目也是bootstrap.js启动的，在bootstrap.js中加载了一个bootstrap.json文件，其中有ext主题打包之后的css文件路径与名称，替

1.需求：在表单里面根据单选按钮的勾选来显示对应类型的输入框显示出来让用户填写；2.思路：使用双向绑定来实现，当单选按钮勾选时，获取值，修改viewModel中的值，这里的viewModel中的值是绑定到这个单选按钮要控制的那些组件上的hidden属性上的;radio如下：controllerviewModel被控制的组件

在EXT表格中有一些行需要被作废，需要用代表作废的颜色来作为这一行的背景色，方便用户阅读首先，定义一个代表作废的颜色，例如然后设置grid的viewConfig这是我的状态列以及数据来看下效果，如果是要作废的，应该显示一个淡黄色背景

看了半天发现ext的上传图片的组件里面有2个input第一个是显示图片名字的 不用管它；我们要第二个获取里面的路径document.getElementById("photoshowup-button-fileInputEl").files.item(0)这个会得到一个数据我这个预览图片就是把得到的这个数据在reader出来这个是reader后的图片

做了个省市县级联下拉

大家有的查询页面的grid分页条显示信息不对，需要修改如下代码，修改store属性dockedItems:[        {  xtype:'pagingtoolbar',                                    //将store设置为当前查询的store名称  store:'xxxStore',  dock:'bottom',  dis

1、目的：实现一个能局部放大缩略图的功能2、目前已完成效果3、局部放大还没有做4、思路，给缩略图的图片容器设设置tips 在tips中显示大一点的另一个图片5、代码view/** * Created by Sukla on 2018/3/26. */Ext.define('app.view.common.pictureMagnifier.PictureMagnifierView', { ...