Как вы включаете класс 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 при первой загрузке с этим.

Есть идеи?

ИЗМЕНИТЬ:

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

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

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

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


extjs gridpanel
person egerardus    schedule 25.04.2012    source источник
comment
Поскольку это первая запись, когда я гуглил вышеуказанную проблему, но последний способ решения Sencha Architect выглядит следующим образом, я хотел бы поделиться ссылкой: Как загрузить внешние классы в Extjs4 и SA   -  person Benjamin E.    schedule 03.09.2012

Ответы (5)


arrow_upward
14
arrow_downward

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

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

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

Или куда бы вы ни поместили UX-классы, в целях сокращения, специфичные для приложения UX-классы должны быть вытащены и помещены в вашу собственную папку, например, app/ux, как описано в посте.

person egerardus    schedule 25.04.2012
comment
Просто не забывайте обновлять их после каждого перехода на более новую версию ExtJS. - person HDave; 05.12.2012
comment
это загрузка отдельных файлов js, как мы можем иметь уменьшенную версию в одном файле, например, ext-ux.js, как ext-all.js - person Sparrow; 18.06.2020

arrow_upward
4
arrow_downward

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

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

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

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

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

Затем я сделал сборку приложения сенчи.

person dfox    schedule 14.04.2016

arrow_upward
3
arrow_downward

Вы можете комбинировать параметры загрузчика вместе, что упрощает чтение и понимание структуры приложения/файла. Я считаю, что происходит то, что вам не хватает определения того, где находятся файлы библиотек и файлы приложений - все относительно 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, вам нужно выбрать Application, добавить Loader (панель конфигурации). Это предложит загрузчик с объектом пути, который можно изменить. Параметр enabled — это флажок, по умолчанию установленный на true.

РЕДАКТИРОВАТЬ: Что-то, что я не прояснил, это то, что исходные файлы библиотеки и файлы приложений не нужно определять в большинстве случаев, особенно с использованием макета файлов по умолчанию. Этого следующего фрагмента часто бывает достаточно:

Ext.Loader.setConfig({
    enabled : true,
    paths: {
        'Ext.ux' : 'ux'
    }
});
person greg.arnott    schedule 18.07.2013

arrow_upward
1
arrow_downward

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

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

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

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

person Arun V    schedule 25.04.2012
comment
Загрузчик ищет UX-классы в extjs/src/ux. Но я не обязательно хочу перемещать все классы ux в папку src. Нет ли места, где я могу сопоставить строку пространства имен со строкой пути? как Ext.ux = app/ux. Также см. изменения при дальнейших попытках. - person egerardus; 25.04.2012

arrow_upward
0
arrow_downward

В моем случае (с использованием 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'],
person jgrocha    schedule 28.03.2014