Az Orchardban modul fejlesztésekor hozzáadhatunk néhány stílust vagy szkriptet, amelyek kifejezetten erre a modulra vonatkoznak. Weboldal optimalizálási szempontból gyakran el kell adnunk stílusokat az oldal fejére (<head>a címkénél), míg a szkripteket az oldal aljára (a címke közelébe) kell hozzáadni</body>. Azonban a kifejlesztett modulhoz tartozó view fájl valójában egy PartialView, és ha stílus- vagy szkripthivatkozási címkéket adunk hozzá közvetlenül a nézethez, nem értjük el a kívánt hatást. Hogyan kezelik ezt a funkciót az Orchardban?
Az MVC nézetmotorjának WebViewPage osztályát átírták az Orchard keretrendszerben, és a scrip{filter}t és a Style attribútumokat hozzáadták, hogy stílusokat és szkripteket vezessenek be. Ez lehetővé teszi, hogy ezeket a két tulajdonságot közvetlenül a nézetben használjuk a megfelelő metódus meghívására.
Használj belső stílusokat és szkripteket a nézeteidben
Ha stílusdefiníciót vagy szkriptdefiníciót kell közvetlenül az oldalra írnunk. Ezután stílusokat és szkripteket írhatunk az Orchard témája által meghatározott területekre. Például írhatsz szkriptet az oldal alsó részére a következő módszerrel:
@using (scrip{filter}t.Foot())
{
<scrip{filter}t type="text/javascrip{filter}t">
function JsSub() {
A forgatókönyvek itt írhatók
}
</scrip{filter}t>
}
Az Orchardban a Stílus attribútumnak nincs fej módszere, talán az Orchard nem akarja, hogy belső stílusokat használjunk. Tegyük a stílust egy külső stílusfájlba, hogy referenciát kapjunk.
Használj külső stílusokat és szkripteket a saját nézetedben
Ha stílusokat és szkripteket akarunk hívni modulokban. Ezután használhatom a scrip{filter}t és Style attribútumok Include metódusát, például:
@{
Stílus.Tartalmazz(xxx.css");
scrip{filter}t.Include("xxx.js");
}
Így az oldal renderelésekor az Orchard automatikusan megkeresi a megfelelő stílusfájlt a modul Stílusok könyvtárában, és létrehoz egy stílushivatkozási címkét, amelyet az oldal fejére írhat. Emellett a scrip{filter}ts könyvtárban keresi a megfelelő szkripfájlt, és generál egy script hivatkozás címkét az oldal alján.
Erőforrás fájlok használata
A fent leírt két módszer mellett az Orchard egy erőforrásfájl manifest függvényt is biztosít. Csak egy ResourceManifest.cs fájlt kell létrehoznom a modul gyökérkönyvtárában, és implementálnom az IResourceManifestProvider interfészt. Ebben a resource manifest fájlban gazdagabb funkciókat használhatunk stílusok és szkriptfájlok hivatkozására.
Például egy szkriptfájl hivatkozásának definiálása a következőképpen használható:
public void BuildManifests(ResourceManifestBuilder builder) {
Építő. Add(). Definescrip{filter}t("jQuery"). SetUrl("jquery-1.5.2.min.js")
}
Így, amikor egy nézetre hivatkozik, használhatod a következőket:
@{
scrip{filter}t.Require("jQuery");
}
Továbbá, a definifikáció után más modulok is használhatják ezt az erőforrást, és ha egy oldalon több nézetfájl is hivatkozik erre az erőforrásra, nem lesznek duplikált hivatkozások, és az Orchard csak egy címkét generál, amely erre a szkriptra hivatkozik.
Ugyanez igaz a meghatározó stílusokra is:
Építő. Add(). DefineStyle("jQueryUI_Orchard"). SetUrl("jquery-ui-1.8.11.custom.css");
Használatkor:
@{
Stílus.Igényli("jQueryUI_Orchard ");
}
Az erőforrás-fájllistának van egy függőségi beállítási funkciója is. Amikor egy szkript-erőforrásnak más szkriptforrásokra kell támaszkodnia, a következő definíciót lehet használni:
Építő. Add(). Definescrip{filter}t("jQueryUI_Core"). SetUrl("jquery.ui.core.min.js"). SetDependencies ("jQuery");
Így csak jQueryUI_Core szkriptet használunk a nézeten, és automatikusan importálja azt a jquery szkriptet, amelyhez kapcsolódik.
Ha egyszerre több szkriptre támaszkodsz, akkor vesszővel választhatsz több függő erőforrást, például:
Építő. Add(). Definescrip{filter}t("jQueryUI_Draggable"). SetUrl("jquery.ui.draggable.min.js")SetDependencies("jQueryUI_Core", "jQueryUI_Widget", "jQueryUI_Mouse");
Az Orchard azonban még nem támogatja a szkriptforrások stílusalapú erőforrásait, ami kissé kár, valójában néhány js-t egyszerre kell használni stílusfájlokkal, például a jQueryUI bővítményt.
Ezen felül az erőforrás-leltár fájl különböző szkriptfájlokat is beállíthat hibakeresési módra és kiadási módra, valamint meghatározhatja a megfelelő erőforrás-verziót, például:
Építő. Add(). Definescrip{filter}t("jQuery"). SetUrl("jquery-1.5.2.min.js", "jquery-1.5.2.js"). SetVersion("1.5.2");
Az Orcharddal együtt érkező Orchard.jQuery modul egy ilyen modul, amely a jQueryUI plugint definiálja. Ha ezt a bővítményt kell használnunk, megnézhetjük a js plugint, amely ebben a manifest fájlban definiált, és hivatkozhatunk rá a saját modulunkban. Ugyanakkor érdemes megjegyezni, hogy ha az Orchard.jQuery modul tartalmára kell hivatkoznunk, akkor a dependency Orchard.jQuery modult be kell állítanunk a modul manifest fájlban, így amikor a modulunk engedélyezve van, az Orchard.jQuery modul szinkronban legyen engedélyezve, hogy a hivatkozott erőforrásokat normálisan lehessen meghívni.
A jquery a scrip{filter}t.Require("jQuery") használatával van hivatkozva. AtHead();
|
Közzétéve 2016. 07. 28. 16:21:53
|
|
|
