При разработке модуля в Orchard мы можем добавить некоторые стили или скрипты, специфичные для этого модуля. С точки зрения оптимизации веб-страницы часто нужно добавлять стили в начало страницы (<head>у метки), а скрипты — внизу страницы (рядом</body> с меткой). Однако файл представления, соответствующий разработанному нами модулю, на самом деле является PartialView, и если мы напрямую добавим стилевые или скриптовые ссылочные теги к просмотру, мы не добьёмся желаемого эффекта. Так как же эта функция реализована в Orchard?
Класс WebViewPage движка MVC view был переписан в фреймворке Orchard, а атрибуты scrip{filter}t и Style добавлены для добавления стилей и скриптов. Это позволяет использовать эти два свойства непосредственно в представлении для вызова соответствующего метода.
Используйте внутренние стили и скрипты в своих представлениях
Если нам нужно написать определение стиля или скрипта напрямую на странице. Затем мы можем записывать стили и сценарии в конкретные области, определённые темой Orchard. Например, вы можете написать скрипт в нижней части страницы следующим способом:
@using (scrip{filter}t.Foot())
{
<scrip{filter}t type="text/javascrip{filter}t">
функция JsSub() {
Здесь можно написать скрипты
}
</scrip{filter}t>
}
В Orchard атрибут Style не имеет метода Головы, возможно, Orchard не хочет, чтобы мы использовали внутренние стили. Давайте поместим стиль во внешний файл стиля для справки.
Используйте внешние стили и скрипты по вашему мнению
Если мы хотим вызывать стили и скрипты в модулях, Затем я могу использовать метод Включить атрибуты scrip{filter}t и Style, например:
@{
Style.Include("xxx.css");
scrip{filter}t.Include("xxx.js");
}
Таким образом, при рендеринге страницы Orchard автоматически найдёт соответствующий файл стилей в каталоге Styles в этом модуле и сгенерирует тег ссылки на стиль для записи в начале страницы. Он также найдёт соответствующий скрипт-файл в каталоге scrip{filter}ts и сгенерирует тег script reference, написанный внизу страницы.
Используйте ресурсные файлы
В дополнение к двум описанным выше методам, Orchard также предоставляет функцию манифеста файла ресурсов. Мне просто нужно создать ResourceManifest.cs-файл в корневой директории модуля и реализовать интерфейс IResourceManifestProvider. В этом файле манифеста ресурсов мы можем использовать более богатые функции для ссылок на стили и скрипт-файлы.
Например, определение ссылки на скрипт-файл может использоваться так:
public void BuildManifests(ResourceManifestBuilder builder) {
Строитель. Add(). Definescrip{filter}t("jQuery"). SetUrl("jquery-1.5.2.min.js")
}
Таким образом, при ссылке на представление можно использовать:
@{
scrip{filter}t.Require("jQuery");
}
Кроме того, после определения другие модули также могут использовать этот ресурс, и когда на странице есть несколько файлов представлений, ссылающихся на этот ресурс, дублирующихся ссылок не будет, и Orchard генерирует только тег, ссылающийся на этот скрипт.
То же самое касается определения стилей:
Строитель. Add(). DefineStyle("jQueryUI_Orchard"). SetUrl ("jquery-ui-1.8.11.custom.css");
При использовании:
@{
Style. Require("jQueryUI_Orchard");
}
Список файлов ресурсов также имеет функцию настройки зависимостей. Когда ресурс скрипта должен зависеть от других ресурсов скрипта, можно использовать следующее определение:
Строитель. Add(). Definescrip{filter}t("jQueryUI_Core"). SetUrl("jquery.ui.core.min.js"). SetDependencies("jQuery");
Таким образом, мы используем jQueryUI_Core скрипт в представлении, и он автоматически импортирует скрипт jquery, от которого он зависит.
Если вы одновременно полагаетесь на несколько скриптов, можно использовать запятые для разделения нескольких зависимых ресурсов, например:
Строитель. Add(). Definescrip{filter}t("jQueryUI_Draggable"). SetUrl("jquery.ui.draggable.min.js")SetDependencies("jQueryUI_Core", "jQueryUI_Widget", "jQueryUI_Mouse");
Однако Orchard пока не поддерживает функцию скрипт-ресурсов, зависящих от ресурсов стиля, что немного жаль, на самом деле некоторые j файлы нужно использовать одновременно с файлами стиля, например, плагин jQueryI.
Кроме того, файл инвентаризации ресурсов может задавать разные скрипт-файлы для режима отладки и режима выпуска, а также определять соответствующую версию ресурса, например:
Строитель. Add(). Definescrip{filter}t("jQuery"). SetUrl ("jquery-1.5.2.min.js", "jquery-1.5.2.js"). SetVersion("1.5.2");
Модуль Orchard.jQuery, входящий в комплект с Orchard, является одним из таких модулей, определяющих плагин jQueryI. Если нам нужно использовать этот плагин, мы можем посмотреть js-плагин, определённый в этом файле манифеста, и ссылаться на него в нашем собственном модуле. Однако стоит отметить, что если нам нужно ссылаться на содержимое в модуле Orchard.jQuery, нужно установить модуль зависимостей Orchard.jQuery в файле манифеста модуля, чтобы при включении модуля Orchard.jQuery был синхронно активирован и гарантировать, что ресурсы, на которые мы ссылаемся, могут быть вызваны нормально.
jquery ссылается с помощью scrip{filter}t.Require("jQuery"). AtHead();
|
Опубликовано 28.07.2016 16:21:53
|
|
|
