Când dezvoltăm un modul în Orchard, putem adăuga unele stiluri sau scripturi specifice acestui modul. Din perspectiva optimizării paginii web, adesea trebuie să adăugăm stiluri în capul paginii (<head>la etichetă), în timp ce scripturile vor să fie adăugate în partea de jos a paginii (aproape</body> de etichetă). Totuși, fișierul de vizualizare corespunzător modulului pe care l-am dezvoltat este de fapt un PartialView, iar dacă adăugăm etichete de stil sau referință de script direct în vizualizare, nu vom obține efectul dorit. Deci, cum este gestionată această funcție în Orchard?
Clasa WebViewPage a motorului de vizualizare MVC a fost rescrisă în cadrul Orchard, iar atributele scrip{filter}t și Style au fost adăugate pentru a introduce stiluri și scripturi. Acest lucru ne permite să folosim aceste două proprietăți direct în vizualizare pentru a chema metoda corespunzătoare.
Folosește stiluri și scripturi interne în vizualizările tale
Dacă trebuie să scriem o definiție de stil sau un script direct în pagină. Apoi putem scrie stiluri și scripturi în zone specifice definite de tema Orchard. De exemplu, poți scrie un script în zona de jos a paginii folosind următoarea metodă:
@using (scrip{filter}t.Foot())
{
<scrip{filter}t type="text/javascrip{filter}t">
funcția JsSub() {
Scenariile pot fi scrise aici
}
</scrip{filter}t>
}
În Orchard, atributul Stil nu are metoda Capului, poate că Orchard nu vrea să folosim stiluri interne. Așadar, să punem stilul într-un fișier de stil extern ca referință.
Folosește stiluri și scripturi externe în vizualizarea ta
Dacă vrem să apelăm stiluri și scripturi în module. Apoi pot folosi metoda Include a atributelor scrip{filter}t și Style, cum ar fi:
@{
Style. Include("xxx.css");
scrip{filter}t.Include("xxx.js");
}
Astfel, la redarea unei pagini, Orchard va căuta automat fișierul de stil corespunzător în directorul Styles din acest modul și va genera o etichetă de referință de stil pentru a scrie în capul paginii. De asemenea, va căuta fișierul de script corespunzător în directorul scrip{filter}ts și va genera o etichetă de referință de script scrisă în partea de jos a paginii.
Folosește fișierele de resurse
Pe lângă cele două metode descrise mai sus, Orchard oferă și o funcție de manifestare a fișierelor de resurse. Trebuie doar să creez un fișier ResourceManifest.cs în directorul rădăcină al modulului și să implementez interfața IResourceManifestProvider. În acest fișier manifest de resurse, putem avea funcții mai bogate pentru referințierea stilurilor și fișierelor script.
De exemplu, definirea unei referințe către un fișier script poate fi folosită cu:
public void BuildManifests(ResourceManifestBuilder builder) {
Constructor. Adaugă(). Definescrip{filter}t("jQuery"). SetUrl("jquery-1.5.2.min.js")
}
Astfel, când faci referință pe o vizualizare, poți folosi:
@{
scrip{filter}t.Require("jQuery");
}
Mai mult, după definire, alte module pot folosi această resursă, iar când există mai multe fișiere de vizualizare care fac referire la această resursă pe o pagină, nu vor exista referințe duplicate, iar Orchard va genera doar o etichetă care face referire la acest script.
La fel se întâmplă și cu stilurile definitorii:
Constructor. Adaugă(). DefineStyle("jQueryUI_Orchard"). SetUrl("jquery-ui-1.8.11.custom.css");
Când folosești:
@{
Stil. Exige("jQueryUI_Orchard ");
}
Lista de fișiere de resurse are, de asemenea, o funcție de setare a dependenței. Când o resursă de script trebuie să depindă de alte resurse de script, se poate folosi următoarea definiție:
Constructor. Adaugă(). Definescrip{filter}t("jQueryUI_Core"). SetUrl("jquery.ui.core.min.js"). SetDependencies("jQuery");
Astfel, folosim doar jQueryUI_Core script în vizualizare, iar acesta va importa automat și scriptul jquery de care depinde.
Dacă te bazezi pe mai multe scripturi simultan ca scripturi, poți folosi virgulele pentru a separa mai multe resurse dependente, cum ar fi:
Constructor. Adaugă(). Definescrip{filter}t("jQueryUI_Draggable"). SetUrl("jquery.ui.draggable.min.js")SetDependencies("jQueryUI_Core", "jQueryUI_Widget", "jQueryUI_Mouse");
Totuși, Orchard nu suportă încă funcția resurselor de script care se bazează pe resurse de stil, ceea ce este puțin păcat, de fapt, unele js trebuie folosite în același timp cu fișierele de stil, cum ar fi pluginul jQueryUI.
În plus, fișierul de inventar al resurselor poate seta fișiere de script diferite pentru modul de depanare și modul de lansare și poate defini versiunea corespunzătoare a resurselor, cum ar fi:
Constructor. Adaugă(). Definescrip{filter}t("jQuery"). SetUrl("jquery-1.5.2.min.js", "jquery-1.5.2.js"). SetVersion ("1.5.2");
Modulul Orchard.jQuery care vine cu Orchard este unul dintre aceste module care definește pluginul jQueryUI. Dacă trebuie să folosim acest plugin, putem privi pluginul js definit în acest fișier manifest și să-l referințăm în propriul nostru modul. Totuși, merită menționat că, dacă trebuie să facem referire la conținutul modulului Orchard.jQuery, trebuie să setăm dependența Orchard.jQuery în fișierul manifest al modulului, astfel încât atunci când modulul nostru este activat, modulul Orchard.jQuery să fie activat sincron pentru a asigura că resursele la care facem referire pot fi apelate normal.
Jquery este referențiat folosind scrip{filter}t.Require("jQuery"). AtHead();
|
Postat pe 28.07.2016 16:21:53
|
|
|
