本文共 2093 字，大约阅读时间需要 6 分钟。

ext 6.7

app.js , index.html基本上不用动，先不看是什么意思，先把demo的搞懂

application.js好像也不用都动，里面写着

Ext.define('myApp.Application', {
   	extend: 'Ext.app.Application',	name: 'myApp',  //应该是从这里跳到主界面的	requires: ['myApp.*'],  ...  }

VeiwPort 代表整个浏览器显示区域，该对象渲染到页面的body 区域，并会随着浏览器显示区域的大小自动改变，一个页面中只能有一个ViewPort 实例。Viewport 不需要再指定renderTo，而我们也看到Viewport 确实填充了整个浏览器显示区域，并会随着浏览器显示区域大小的改变而改改。Viewport 主要用于应用程序的主界面，可以通过使用不同的布局来搭建出不同风格的应用程序主界面。在Viewport 上常用的布局有fit、border 等，当然在需要的时候其它布局也会常用。

launch: function () {
   		this.removeSplash()    //应该默认是加载主界面时显示的是名字为MainView的那个组件		var whichView = 'mainview'		Ext.Viewport.add([{
   xtype: whichView}])	},

永远忘不了：

Ext.define('giveuped.view.main.MyGrid',{
       extend: 'Ext.grid.Grid'    });

记好你的ui版本，然后去这个页面：

xtype

ext只有classic和medern两个版本，只不过两个版本中的ui界面不一样罢了，所以只要看classic版本的即可，ui界面随时可以更换

要创建classic的界面，要使用–template destop这样的指定template

ext-gen app --template classicdesktop --classictheme theme-triton -n finalTest

如果有错误，看看generatatedFiles文件夹里面是否只有readme，是的话，如下

方法后面别忘了加上：

this.renderTo = Ext.getBody();this.callParent();

方法constructor和initComponent里面都要加上这样两句话：

this.renderTo = Ext.getBody();        this.callParent();

listener:给事件添加

怎么样才能传递数据到controller呢？

这里首先要声明controller：

Ext.define('my-grid.view.grid.MyGridController', {
       extend: 'Ext.app.ViewController',    //格式记清楚：alisa:'controller.xxxx'    alias: 'controller.mygridcontroller',});

之后在界面上声明该controller：

Ext.define('my-grid.view.grid.myGridView', {
       extend: 'Ext.grid.Panel',    xtype: 'mygridview',    //格式看好：controller:'xxxx'    controller: 'mygridcontroller',        tbar: [{
         xtype: 'button',      text: '打开订单',      tooltip: '打开订单',      //调用时，直接事件：xxxx中的方法即可，方法中可通过this.getView()直接获得此界面的全部信息      listeners: {
             click:'handleBuyAction'      }    }],}

EXT的手册讲解：

configs: 代表配置  以类的方式直接怕配置时，配这里面的东西即可properties： 是属性  你在界面上log出来的信息，动态生成时的属性，基本上都在这里methods： 是方法events： 是事件，事件的作用是  事件名：function(){
   }即可给事件添加方法

转载地址：https://blog.csdn.net/qq_40666620/article/details/100927666 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！