Question

在MVC模式之前，我会在Ext.onReady之前将这个包含在JS的顶部，包括UX类：

Ext.Loader.setConfig({enabled: true});
Ext.Loader.setPath('Ext.ux', 'extjs/examples/ux');
Ext.require([
    'Ext.ux.grid.FiltersFeature'
]);

现在我正在使用MVC模式，我有一个需要使用同一功能的网格面板。我在视图中包含了一个require语句，如下所示：

Ext.define('ST.view.StudentLog', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.studentlog',
    requires: [
        'Ext.ux.grid.FiltersFeature'
    ],

但该应用首次开始加载时会产生404错误。

有什么想法吗？

修改

我尝试在视图顶部放置相同的代码块也无济于事（指Ext.Loader.setConfig / .setPath块）。

无论我怎么试着告诉它，加载器都会继续尝试从extjs/src/ux/加载UX类。根据{{3}}，我也尝试在我的应用程序控制器中定义一个路径属性，但它看起来像回答者在源代码中看到的那样在4.1 rc3中不存在因为我找不到它而且它不起作用。

如果我只是在我的HTML中使用<script>标记将FilterFeature.js添加为导入的源文件，那么当我的应用启动时，所有依赖项都会出现404错误。

必须有一种简单的方法可以直接从UX文件夹中将UX类包含在应用程序中，以便它可以链接到其他UX依赖项。

Answer 1

好的，我是从this post找到的。

只需在app控制器的顶部使用Ext.Loader.setPath调用，例如：

Ext.Loader.setPath('Ext.ux', 'extjs/examples/ux');
Ext.application({
    name: 'ST',
    autoCreateViewport: true,
    ...

或者，如果你想放置ux类，为了实现压缩目的，应该将特定于应用程序的UX类拉出并放在你自己的文件夹中，如帖子所涵盖的那样app/ux。

Answer 2

Extjs 6，使用MVVC和sencha cmd。我使用sencha generate app来启动应用程序。我编码到我想要使用ItemSelector的位置，修改了app.json以要求在ux中添加一个块：

"requires": [
  "font-awesome",
  "ux"
],

在我想要创建ItemSelector小部件的控制器代码中：

requires: [
    'Ext.ux.form.MultiSelect',
    'Ext.ux.form.ItemSelector'
],

以及用于创建ItemSelector的相应代码。我遇到的一个问题是，它想要一个带模型的真实数据存储，而我无法使用模拟数据。

然后我做了一个sencha app build

Answer 3

您可以将Loader参数组合在一起，使其易于阅读和理解应用程序/文件结构。我相信正在发生的事情是你错过了库文件和应用程序文件所在的定义 - 所有相对于app.js.因此，当您加载时，应用程序尝试使用基于主命名空间路径（extjs / src）而不是应用程序根目录的文件。

Ext.Loader.setConfig({
    enabled : true,
    paths: {
        'Ext'    : 'extjs/src', // library src folder/files
        'MyApp'  : 'app',       // app namespace folder/files
        'Ext.ux' : 'ux'         // extension namespace folder/files
    }
});

同样的过程也适用于触摸 - 只需将“extjs”换成“触摸”。

如果使用Architect，则需要选择Application，添加Loader（配置面板）。这将为Loader提供一个可以修改的路径对象。 已启用选项是一个复选框选项，默认为true。

编辑：我没有说清楚的是，在大多数情况下，不需要定义库源和应用程序文件，尤其是使用默认的文件布局。以下代码段通常很充足：

Ext.Loader.setConfig({
    enabled : true,
    paths: {
        'Ext.ux' : 'ux'
    }
});

Answer 4

这听起来像是Ext.ux.grid.FiltersFeature文件所在路径的问题。你能检查导致404的请求的URL是什么吗？这应该可以为您提供一个线索，以便Ext.ux.grid.FiltersFeature放置它以自动加载。

以下是我正在使用的目录结构以及ux类所在的示例。

js
|---app.js
|
|---app
|    |---controller
|    |---model
|    |---store
|    +---view
|
+---ux
     |---form
     +---layout

基本上，命名空间将遵循目录结构。

Answer 5

在我的情况下（使用ux/DataTip.js），使用ext-4.2.1.883和sencha cmd 4.0.2.67，我可以使用提供的解决方案使用Ext.ux类，使用：

Ext.Loader.setPath('Ext.ux', 'extjs/examples/ux');

但sencha app refresh抱怨：

[ERR] C2008：要求没有匹配的文件（Ext.ux.DataTip）

应对/关联extjs/examples/ux与extjs/src/ux解决了我的问题。该应用程序有效，sencha cmd也可以跟踪事物。使用此复制/链接操作，无需使用Ext.Loader.setPath。只需在要求中使用该类：

Ext.define('Demo.Application', {
name : 'Demo',
requires : [ (...), 'Ext.ux.DataTip'],

你如何在MVC模式中包含UX类？

5 个答案: