Introduction détaillée à la méthode de chargement des ressources css, js et statiques dans Yii2

Cet article présente principalement la méthode de chargement de CSS et js pour charger des ressources statiques dans Yii2. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

Scénarios d'application

Yii2 fournit la classe AppAsset pour gérer les ressources statiques. Lorsque vous utilisez le modèle de mise en page Yii2, si vous souhaitez écrire un morceau de js à l'intérieur. une page et En bas de page, il n'est pas possible d'utiliser directement les balises de script.

Utilisez la classe AppAsset pour gérer les ressources statiques

Ouvrez assetsAppAsset.php et définissez addJs() et addCss() pour une introduction dans les pages statiques respectivement. Fichiers js externes, css

1. Modifier le code du fichier AppAsset.php

namespace backend\assets;
use yii\web\AssetBundle;
/**
 * @author Qiang Xue 
 * @since 2.0
 */
class AppAsset extends AssetBundle
{
  public $basePath = "@webroot";
  public $baseUrl = "@web";
  //默认自动加载样式
  public $css = [
    "css/site.css",
  ];
  //默认自动加载js
  public $js = [
  ];
  //依赖关系管理
  public $depends = [
    "yii\web\YiiAsset",
    "yii\bootstrap\BootstrapAsset",
  ];  
  //定义按需加载JS方法，注意加载顺序在最后 
  public static function addJs($view, $jsfile) { 
    $view->registerJsFile(
      $jsfile, 
      [
        AppAsset::className(), 
        "depends" => "backend\assets\AppAsset"
      ]
    ); 
  } 
  //定义按需加载css方法，注意加载顺序在最后 
  public static function addCss($view, $cssfile) { 
    $view->registerCssFile(
      $cssfile, 
      [
       AppAsset::className(), 
       "depends" => "backend\assets\AppAsset"
      ]
    ); 
  } 
}

2. sur une page statique .php

<?php

use backend\assets\AppAsset;
AppAsset::register($this);
AppAsset::addJs($this,Yii::$app->request->baseUrl."/js/a.js");
AppAsset::addCss($this,Yii::$app->request->baseUrl."/css/b.css");
?>

Chargez le code javascript en bas de la page du site

fichier js à l'intérieur de la page Web Ou codez, selon la séquence de chargement de la page, pour éviter d'exécuter le processus temporel js et de rendre la page vide, ce qui entraînerait une mauvaise expérience utilisateur. Généralement placé en bas de la page Web après .

Option 1

<?php
$this->registerJs("
  $(function () {
  //为所欲为的写你想要写的js代码吧
  
  });
", \yii\web\View::POS_END);

Option 2

<?php $this->beginBlock(&#39;js&#39;) ?> 

  //js代码
  
<?php $this->endBlock() ?> 
<?php $this->registerJs($this->blocks[&#39;js&#39;], \yii\web\View::POS_END); ?>

Solution au problème selon lequel Yii2 charge JS en bas de la page et l'invite de syntaxe échoue

Ajoutez simplement la balise script. Notez que seule l'option 2 est valide. Si vous connaissez d'autres méthodes, veuillez nous en informer, merci !

<script type="text/javascript">
<?php $this->beginBlock(&#39;js&#39;) ?> 
  //js代码
<?php $this->endBlock() ?> 
<?php $this->registerJs($this->blocks[&#39;js&#39;], \yii\web\View::POS_END); ?> 
</script>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!