Как включить класс UX в шаблон MVC?

До шаблона MVC я бы включил классы UX, просто включив его в начало JS, перед Ext.onReady:

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, когда она сначала начинает загрузку с этим.

Любые идеи?

EDIT:

Я попытался помещать этот же блок кода в верхнюю часть представления также безрезультатно (ссылаясь на блок Ext.Loader.setConfig / .setPath).

Загружатель продолжает загружать классы UX из extjs/src/ux/ независимо от того, как я пытаюсь сказать об этом иначе. Согласно этому предложению, я также попытался определить свойство path в моем контроллере приложений, но похоже, что независимо от того, что ответчик видел в источнике, тогда не существует в 4.1 rc3, потому что я не могу его найти, и он не работает.

Если я просто добавлю FilterFeature.js в качестве импортированного исходного файла в свой HTML с тегами <script>, тогда все его зависимости получат 404 ошибки при запуске моего приложения.

Должен быть простой способ включения классов UX в приложение прямо из папки UX, чтобы он мог ссылаться на другие зависимости UX.

Ответы

Ответ 1

Хорошо, я нашел его из этого сообщения.

Просто нужно использовать вызов Ext.Loader.setPath в верхней части контроллера приложения, например:

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

В любом случае, если вы хотите поместить классы ux, в целях уплотнения, определенные для конкретного класса классы UX следует вытащить и застрять в вашей собственной папке примерно как app/ux по мере того, как сообщение закрывается.

Ответ 2

Вы можете комбинировать параметры 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" на "touch".

Если вы используете Architect, вам нужно выбрать приложение, добавить Loader (панель конфигурации). Это предложит загрузчик с объектом пути, который можно изменить. Опция включена - это флажок, по умолчанию используется значение true.

EDIT: Что-то я не прояснил, так это то, что файлы библиотеки и файлы приложений не обязательно должны определяться в большинстве случаев, особенно с использованием макетов по умолчанию. Этот следующий фрагмент часто достаточно:

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

Ответ 3

Extjs 6, используя MVVC и sencha cmd. Я использовал приложение sencha generate для запуска приложения. Я закодировал до такой степени, что хотел использовать ItemSelector, изменил app.json, чтобы потребовать блок, добавленный в ux:

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

В моем коде контроллера, где я хотел создать виджет ItemSelector:

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

и соответствующий код для создания ItemSelector. Одна из проблем, с которой я столкнулся, заключается в том, что он хочет иметь реальное хранилище данных с моделью, и я не мог использовать данные, издевавшиеся над созданием.

Затем я сделал сборку sencha app

Ответ 4

Это звучит как проблема с путём, в котором находится файл Ext.ux.grid.FiltersFeature. Можете ли вы проверить, какой URL-адрес для запроса, который вызвал 404? Это должно дать вам представление о том, где разместить Ext.ux.grid.FiltersFeature для его автоматической загрузки.

Вот пример структуры каталога, которую я использую, и где классы ux.

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

В основном, пространство имен будет следовать структуре каталогов.

Ответ 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'],