Praca ze skryptami

Note: Ta sekcja nie została jeszcze ukończona.

Rejestrowanie skryptów

Dzięki obiektowi yii\web\View możesz rejestrować skrypty w aplikacji. Przeznaczone są do tego dwie dedykowane metody: yii\web\View::registerJs() dla skryptów wbudowanych oraz yii\web\View::registerJsFile() dla skryptów zewnętrznych. Skrypty wbudowane są przydatne przy konfiguracji oraz dynamicznym generowaniu kodu. Możesz dodać je w następujący sposób:

$this->registerJs("var options = " . json_encode($options) . ";", View::POS_END, 'my-options');

Pierwszy argument przekazywany do metody registerJs to kod JavaScript, który chcemy umieścić na stronie. Jako drugi argument wskazujemy miejsce, w którym skrypt ma zostać umieszczony na stronie. Możliwe wartości to:

yii\web\View::POS_HEAD dla sekcji head.
yii\web\View::POS_BEGIN zaraz po otwarciu tagu <body>.
yii\web\View::POS_END zaraz przed zamknięciem tagu </body>.
yii\web\View::POS_READY do wywołania kodu z użyciem zdarzenia ready na dokumencie. Ta opcja zarejestruje automatycznie yii\web\JqueryAsset
yii\web\View::POS_LOAD do wywołania kodu z użyciem zdarzenia load na dokumencie. Ta opcja zarejestruje automatycznie yii\web\JqueryAsset

Ostatnim argumentem jest unikalne ID skryptu, które jest używane do zidentyfikowania bloku kodu i zastąpienia go, jeśli taki został już zarejestrowany. Jeśli ten argument nie zostanie podany, kod JavaScript zostanie użyty jako ID.

Skrypt zewnętrzny może zostać dodany następująco:

$this->registerJsFile('http://example.com/js/main.js', ['depends' => [\yii\web\JqueryAsset::className()]]);

Argumenty dla metod yii\web\View::registerCssFile() są podobne do yii\web\View::registerJsFile(). W powyższym przykładzie, zarejestrowaliśmy plik main.js z zależnością od JqueryAsset. Oznacza to, że plik main.js zostanie dodany PO pliku jquery.js. Bez określenia tej zależności, względny porządek pomiędzy main.js a jquery.js nie zostałby zachowany.

Tak jak i w przypadku yii\web\View::registerCssFile(), mocno rekomendujemy, abyś użył assetów do zarejestrowania zewnętrznych plików JS zamiast używania yii\web\View::registerJsFile().

Rejestracja assetów

Jak zostało wspomniane wcześniej, korzystniejsze jest stosowanie assetów, zamiast kodu CSS i JS bezpośrednio (po informacje na ten temat sięgnij do sekcji menedżera assetów). Korzystanie z już zdefiniowanych pakietów jest bardzo proste:

\frontend\assets\AppAsset::register($this);

Rejestrowanie kodu CSS

Możesz zarejestrować kod CSS przy użyciu metody yii\web\View::registerCss() lub yii\web\View::registerCssFile(). Pierwsza z nich rejestruje blok kodu CSS, natomiast druga zewnętrzny plik .css. Dla przykładu:

$this->registerCss("body { background: #f00; }");

Powyższy kod doda kod CSS do sekcji head strony:

<style>
body { background: #f00; }
</style>

Jeśli chcesz określić dodatkowe właściwości dla tagu style, przekaż tablicę nazwa => wartość jako drugi argument. Jeśli chcesz się upewnić, że jest tylko jeden tag style, użyj trzeciego argumentu, tak jak zostało to opisane dla meta tagów.

$this->registerCssFile("http://example.com/css/themes/black-and-white.css", [
    'depends' => [BootstrapAsset::className()],
    'media' => 'print',
], 'css-print-theme');

Kod powyżej doda link w sekcji head strony do pliku CSS.

Pierwszy argument określa, który plik ma zostać zarejestrowany,
Drugi argument określa atrybuty tagu <link>. Opcja depends jest obsługiwana w specjalny sposób, od niej zależy położenie pliku CSS. W tym przypadku, plik link do pliku CSS zostanie umieszony ZA plikami CSS w yii\bootstrap\BootstrapAsset,
Ostatni argument określa ID identyfikujące ten plik CSS. W przypadku jego braku, zostanie użyty do tego celu adres URL pliku CSS.

Jest mocno wskazane używanie assetów do rejestrowania zewnętrznych plików CSS. Użycie ich pozwala Ci na łączenie i kompresowanie wielu plików CSS, które jest wręcz niezbędne na stronach internetowych o dużym natężeniu ruchu.

4.5 KiB Raw Blame History

Praca ze skryptami

Rejestrowanie skryptów

Rejestracja assetów

Rejestrowanie kodu CSS

4.5 KiB

Raw Blame History