Yii-ウィジェット

ウィジェットは再利用可能なクライアント側のコードであり、HTML、CSS、およびJSが含まれています。このコードには最小限のロジックが含まれており、yii\base\Widgetオブジェクト。このオブジェクトは、どのビューにも簡単に挿入して適用できます。

Step 1 −ウィジェットの動作を確認するには、 actionTestWidget の機能 SiteController 次のコードで。

public function actionTestWidget() { 
   return $this->render('testwidget'); 
}

上記の例では、 View と呼ばれる “testwidget”

Step 2 −ここで、views / siteフォルダー内に、というビューファイルを作成します。 testwidget.php.

<?php 
   use yii\bootstrap\Progress; 
?> 
<?= Progress::widget(['percent' => 60, 'label' => 'Progress 60%']) ?>

Step 3 −に行く場合 http://localhost:8080/index.php?r=site/test-widget, プログレスバーウィジェットが表示されます。

ウィジェットの使用

でウィジェットを使用するには View、あなたは呼び出す必要があります yii\base\Widget::widget()関数。この関数は、ウィジェットを初期化するための構成配列を取ります。前の例では、構成オブジェクトのパーセントとラベル付きパラメーターを含む進行状況バーを挿入しました。

一部のウィジェットはコンテンツのブロックを取ります。で囲む必要がありますyii\base\Widget::begin() そして yii\base\Widget::end()関数。たとえば、次のウィジェットはお問い合わせフォームを表示します-

<?php $form = ActiveForm::begin(['id' => 'contact-form']); ?> 
   <?= $form->field($model, 'name') ?> 
   <?= $form->field($model, 'email') ?> 
   <?= $form->field($model, 'subject') ?> 
   <?= $form->field($model, 'body')->textArea(['rows' => 6]) ?> 
   <?= $form->field($model, 'verifyCode')->widget(Captcha::className(), [ 
      'template' =>
         '<div class="row">
            <div class = "col-lg-3">{image}</div>
            <div class = "col-lg-6">{input}</div>
         </div>', 
   ]) ?> 
   <div class = "form-group"> 
      <?= Html::submitButton('Submit', ['class' => 'btn btn-primary',
         'name' => 'contact-button']) ?> 
   </div> 
<?php ActiveForm::end(); ?>

ウィジェットの作成

ウィジェットを作成するには、 yii\base\Widget。次に、オーバーライドする必要がありますyii\base\Widget::init() そして yii\base\Widget::run()関数。ザ・run()関数はレンダリング結果を返す必要があります。ザ・init() 関数はウィジェットのプロパティを正規化する必要があります。

Step 1−プロジェクトルートにコンポーネントフォルダを作成します。そのフォルダ内に、というファイルを作成しますFirstWidget.php 次のコードで。

<?php 
   namespace app\components; 
   use yii\base\Widget; 
   class FirstWidget extends Widget { 
      public $mes; 
      public function init() { 
         parent::init(); 
         if ($this->mes === null) { 
            $this->mes = 'First Widget'; 
         } 
      }  
      public function run() { 
         return "<h1>$this->mes</h1>"; 
      } 
   } 
?>

Step 2Modify インクルード testwidget 次のように表示します。

<?php 
   use app\components\FirstWidget; 
?> 
<?= FirstWidget∷widget() ?>

Step 3 −に移動 http://localhost:8080/index.php?r=site/test-widget。次のように表示されます。

Step 4 −コンテンツを begin() そして end() 呼び出し、変更する必要があります FirstWidget.php ファイル。

<?php
   namespace app\components;
   use yii\base\Widget;
   class FirstWidget extends Widget {
      public function init() {
         parent::init();
         ob_start();
      }
      public function run() {
         $content = ob_get_clean();
         return "<h1>$content</h1>";
      }
   }
?>

Step 5−これで、h1タグがすべてのコンテンツを囲みます。を使用していることに注意してくださいob_start()出力をバッファリングする関数。次のコードに示すように、testwidgetビューを変更します。

<?php
   use app\components\FirstWidget;
?>
<?php FirstWidget::begin(); ?>
   First Widget in H1
<?php FirstWidget::end(); ?>

次の出力が表示されます-

重要なポイント

ウィジェットは-

  • MVCパターンに従って作成されます。ビューのプレゼンテーション層とウィジェットクラスのロジックを維持する必要があります。

  • 自己完結型になるように設計されています。エンド開発者は、それをビューに設計できる必要があります。