Javascript 基础
- 同步和异步
- 回调
- json、ajax和jsonp
- call()、apply()、bind()
- 闭包
- 作用域
- 上下文
- this关键字
- 原型和原型链
- 基于原型的继承
ECMAScript 6
- const / let
- 函数的扩展
- 箭头函数
- 参数默认值
- object key value 简写
- 模板字符串
- Array 的扩展
- forEach/map/some/every
- for(let item of array) { }
ExtJS
- 官方指南 + API 文档
- 官方示例
- 其它书籍
- ExtJS 6 Tutorial 英文原版
- ExtJS 6 By Example
Viewport
Component
容器 Container
类和实例
- 定义类define
- 继承extend、覆盖override
- 单例类singleton
- 静态成员statics、inheritableStatics,私有成员privates
- 实例化方法 create/widget/factory
布局 Layout
Classic 和 Modern 都有有的布局
- fit
- card
- box(vbox/hbox)、以及和 css3 弹性盒子布局 的关系
另外 classic 特有的布局
- border
- column
事件 Events
fireEvent/on/un
命名规范
类名、xtype、cls样式类
文件名和类名要对应
注释规范
项目结构 app.json
-
仅创建项目
假设 extjs sdk 解压到了D:\extjs
目录下- 方法1
sencha config --prop sencha.sdk.path=D:\extjs --save
(此句只永久执行一次)cd /d D:\demo
sencha app init --ext@6.5.3 --modern Demo
- 方法2
sencha -sdk D:\extjs\ext-6.5.3 generate app -modern Demo D:\demo
- 方法1
-
创建工作空间+项目
sencha generate workspace D:\Develop\AIO7\Perform-FrontEnd
sencha -sdk G:\ext-6.5.3 generate app -modern Perform1 Perform1
-
创建工作空间+项目(并保留以往的 .sencha/app 目录)
sencha generate workspace --full D:\Develop\AIO7\Perform-FrontEnd
sencha -sdk G:\ext-6.5.3 generate app --full -modern Perform1 Perform1
sencha app watch
构建 sencha app build
配置项
数据包装
store / model / record / field
多重继承
Mixin
包 package
包的类型:theme 和 code
多语言
主题和样式
sass / scss、Theme、ui、字体图标
ExtJS 6 的一些 样式类配置项
模板
tpl、itemTpl
寻找(定位)组件
dom 操作
十大要避免的开发方法
资源管理 Resource Management
如何引用第三方 javascript 库
app.json 里 js: [] 里面引入,会随 app.js 一起打包
ViewModel
View控制器 ViewController
app控制器 Controller
路由 Router
多屏幕适配
builds, profile, responsiveConfig, platformConfig
IDE 和 代码规范
IDE
VSCode + ESlint + Sencha Plugin
ESLint
- javascript 代码规范
- 命名规范:变量名、函数名
- 利用 ESLint 统一团队内开发 ExtJS6 项目 的 javascript 代码规范
- ExtJS 一些命名规范(非官方)