ホームページ > ウェブフロントエンド > htmlチュートリアル > Yii2 をマスターする: プログラミングでリソース バンドルの力を活用する

Yii2 をマスターする: プログラミングでリソース バンドルの力を活用する

WBOY
リリース: 2023-08-31 15:49:08
オリジナル
1244 人が閲覧しました

掌握 Yii2:在编程中利用资源包的力量

「Yii とは何ですか?」という質問がある場合は、私の以前のチュートリアルを参照してください: Yii フレームワークの概要 ここでは、Yii の利点を確認し、 3 月にリリースされた Yii 2.0 の 2014-10 年の新機能の概要。 まあ>

この Yii2 プログラミング シリーズでは、新しくアップグレードされた Yii2 PHP フレームワークの使い方を読者にガイドします。このチュートリアルでは、カスタム JavaScript と CSS のスクリプトとライブラリを Yii アプリケーションに追加する方法を説明します。 Yii は、アセットバンドルと呼ばれる概念を使用して、これらのリソースの管理を容易にします。

これらの例では、前のチュートリアルの単純な状態アプリケーションに基づいて構築を続けます。

念のために言っておきますが、私は以下のコメント スレッドに参加しています。別のアプローチや追加のアイデアがある場合、または将来のチュートリアルのトピックを提案したい場合は、特に興味があります。

アセット パッケージとは何ですか?

Yii のリソース バンドルは、特定のページまたは Web サイト全体に一緒に含める必要がある JavaScript および CSS ファイルのグループを表します。リソース バンドルを使用すると、サイトの特定の領域の特定のスクリプトとスタイルを簡単にグループ化できます。たとえば、Meeting Planner アプリケーションでは、必要なページにのみ Google Places API を簡単に組み込むことができます。

これは簡単な例です。 \frontend\assets\LocateAsset.php ファイルを作成します:

リーリー

次に、それをビュー ファイルにロードします。これは非常に簡単です:

リーリー

ページのソースコードを表示すると、生成されたスクリプトと、フォームやブートストラップなどの他の Yii2 標準リソースが表示されます。 リーリー

このチュートリアルでは、リソース バンドルを使用して文字カウントをステータス フォームに統合する方法を説明します。これを使用して、Twitter の最大 140 文字と同様の文字制限を強制します。

Yii1.x のこの機能に興味がある場合は、「Twitter API を使用した構築: OAuth、読み取り、投稿 (Tuts)」でこの機能を実装しました。

アセット パッケージを構築する

リソースパッケージの作成

\assets ディレクトリに、StatusAsset.php: を作成します。 リーリー

jQuery simpleCountable プラグインである twitter-text.js (JavaScript に基づく Twitter のテキスト処理スクリプト) と、URL 整形を担当するスクリプト twitter_count.js を組み合わせて使用​​しました。Twitter では、URL は 20 文字としてカウントされます。これらのファイルは

\web\js にあります。

また、

\web\js\status-counter.js で呼び出すためのドキュメント準備関数も作成しました。 $depends 配列に yii\web\YiiAsset を含めると、このリソースをインスタンス化するたびに JQuery が確実にロードされます。 リーリー

リソースパッケージをロードする

次の

\views\status\_form. に示すように、リソース パッケージのインスタンス化は非常に簡単です。 リーリー

Twitter スタイルの文字カウンターを有効にするために必要なのはこれだけです:

掌握 Yii2:在编程中利用资源包的力量

Yii アセット バンドルはシンプルで管理しやすいと思います。これらは、アプリケーションの特定の領域で JavaScript と CSS の一部を組織的な方法で再利用するのに役立ちます。

###次は何ですか?

Yii2 決定版ガイドでは、アセット バンドルの高度な機能の多くについて説明しています。パッケージごとにスクリプトをロードする場所を制御できます (例:

POS_HEAD

POS_END)。アセット マッピングを設定して、互換性のある特定のバージョンのライブラリをロードできます。 JavaScript および CSS オプションを設定して、さらに条件付きでバンドルを読み込むことができます。リソース コンバーターを使用して、LESS コードを CSS にコンパイルしたり、TypeScript を JavaScript にコンパイルしたりすることもできます。 フレームワークのさまざまな側面を引き続き掘り下げていくので、「Yii2 によるプログラミング」シリーズの今後のチュートリアルをチェックしてください。また、実際のアプリケーションを構築する際に Yii2 の高度なテンプレートを使用する私の「Building Your Startup with PHP」シリーズもチェックしてみてください。

機能やテーマのリクエストを歓迎します。以下のコメント欄に投稿するか、私の Lookahead Consulting Web サイトから電子メールを送ってください。

次の Yii2 チュートリアルがいつリリースされるか知りたい場合は、Twitter で @reifman をフォローするか、私のインストラクター ページをチェックしてください。私のインストラクター ページには、このシリーズのすべての記事がすぐに含まれます。

###関連リンク###

Yii2 の決定版ガイド: アセット

Yii2 AssetBundle クラスのドキュメント
  • Yii2 Developer Exchange、著者の Yii2 リソース サイト

以上がYii2 をマスターする: プログラミングでリソース バンドルの力を活用するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート