模块化&重用使用ExtJS编写的代码

Modularization & reuse of code written using Ext JS

本文关键字:代码 ExtJS amp 模块化      更新时间:2023-09-26

我需要清楚地将利用ExtJS的JavaScript代码模块化。我的目标是创建扩展ExtJS小部件的自定义类,在几个JavaScript文件(.JS文件)中分发代码。

我已经查阅了关于Ext.Loader的文档,但我并没有完全遵循确保类依赖关系解析的方法。我在一个JavaScript文件中的代码正在按需工作,因为代码的顺序化是按依赖关系进行的。但是,一旦我破坏了几个JavaScript文件中的代码,并想在多个页面中使用,我的依赖关系就会陷入混乱,因为我的所有页面都需要具有不同依赖关系的不同类。

考虑到我在常规后端编码中很容易实现代码分离和重用,这让我很困惑。请帮助输入。我使用的是Ext JS 4.1.1

要在创建自定义组件时启用依赖项解析,请使用Ext.definerequires参数。它看起来像这样:

Ext.define("My.custom.Widget", {
    alias: "widget.mywidget",
    requires: [
        "My.custom.TextField",
        "My.custom.ComboBox",
        "My.custom.Store"
    ],
    constructor: function(config){}
    /* ... */
});

有关更多信息,您应该阅读Sencha网站上的动态加载和新类系统。它详细介绍了动态加载的工作原理。一旦你掌握了窍门,它真的很酷。

差点忘了。您可以显式调用Ext.require来在需要时加载某些文件。它支持通配符、别名等。还有Ext.exclude可以防止加载某些文件。

Sencha有一些非常好的指南可以帮助您掌握框架。http://docs.sencha.com/ext-js/4-1/#/引导

一个好的开始是这样的:http://docs.sencha.com/ext-js/4-1/#/guide/application_architecture应用程序体系结构。本指南清楚地向您展示了如何模块化代码和Loader所期望的文件夹结构。请看一下。