書籍詳細（速習 Vue.js 3）

速習 Vue.js 3 書影

速習 Vue.js 3

山田祥寛 著

著者山田祥寛
出版社WINGSプロジェクト
価格700円（税込）
判形Kindle版・4色
ページ数211ページ
発売日2020年9月19日
シリーズ 速習（QUICK MASTER - WINGS）
対象レベル初級
Amazonで購入
B!

サクッと学べる。Vue.js 3 の解説書。

ビュー（見た目）に特化したシンプルなJavaScriptフレームワークVue.jsを素早くマスターしよう。
本書では、Vue.jsの使い方を12個のPartに分けて、サンプルコードとともに詳しく解説しています。後半では、Vue CLIやVuexを使った開発も紹介しています。

※本書は、旧版「速習 Vue.js」をVue.js 3で改訂したものです。
速習 Vue.js 3 ロゴ

更新履歴

  • 正誤訂正：2022年7月21日 更新

目次

  • はじめに
  • 対象読者
  • サンプルプログラムについて
  • 動作確認環境について
  • Part 1：イントロダクション
  • 1.1 JavaScriptフレームワークとは？
  • 1.2 jQueryの問題点とJavaScriptフレームワーク
  • 1.3 主なJavaScriptフレームワーク
  • Part 2：Vue.jsの基本
  • 2.1 Vue.jsのインストール方法
  • 2.2 Vue.jsアプリの基本
  • 2.3 ディレクティブによるデータアクセス - v-text
  • 2.4 {{...}}式を無効化する - v-pre
  • 2.5 文字列をHTMLとして埋め込む - v-html
  • 2.6 属性値にJavaScript式を埋め込む - v-bind
  • 2.7 プロパティ値をアプリ独自のルールで加工する - 算出プロパティ
  • 2.7.1 別解：メソッドによるロジックの切り出し
  • Part 3：イベント処理
  • 3.1 イベントの基本
  • 3.2 イベントオブジェクトを参照する
  • 3.2.1 イベントハンドラーに引数を渡す場合
  • 3.3 定型的なイベント処理を宣言的に指定する - イベント修飾子
  • 3.3.1 イベント修飾子を利用する場合の注意点
  • 3.4 キーボードからの入力を識別する - キー修飾子
  • 3.4.1 システムキーとの組み合わせを検知する
  • 3.5 マウスの特定のボタンを検知する - マウス修飾子
  • Part 4：フォーム開発
  • 4.1 さまざまなフォーム要素の例
  • 4.1.1 ラジオボタン
  • 4.1.2 チェックボックス（単一）
  • 4.1.3 チェックボックス（複数）
  • 4.1.4 選択ボックス
  • 4.1.5 補足：オブジェクトをバインドする
  • 4.1.6 ファイル入力ボックス
  • 4.2 バインドの動作オプションを設定する - 修飾子
  • 4.2.1 入力値を数値としてバインドする - number修飾子
  • 4.2.2 入力値の前後の空白を除去する - trim修飾子
  • 4.2.3 バインドのタイミングを遅延させる - lazy修飾子
  • 4.3 双方向データバインドのカスタマイズ
  • Part 5：条件分岐とループ
  • 5.1 式の真偽に応じて表示／非表示を切り替える - v-if
  • 5.1.1 式がfalseの場合の表示を定義する - v-else
  • 5.1.2 複数の分岐を表現する - v-else-if
  • 5.2 式の真偽に応じて表示／非表示を切り替える - v-show
  • 5.3 配列／オブジェクトを繰り返し処理する - v-for
  • 5.3.1 配列から要素を順に取得する
  • 5.3.2 インデックス番号を取得する
  • 5.3.3 オブジェクトのプロパティを順に処理する
  • 5.3.4 数値を列挙したい場合
  • 5.4 v-forによるループ処理の注意点
  • 5.4.1 配列の絞り込みには算出プロパティを利用する
  • 5.4.2 異なる要素のセットを繰り返し出力する - template要素
  • 5.4.3 配列の変更を反映する - 変更メソッド
  • Part 6：もっとデータバインディング
  • 6.1 属性に値をバインドする - v-bind
  • 6.1.1 複数の属性をまとめて指定する
  • 6.1.2 要素オブジェクトのプロパティを設定する
  • 6.2 値を一度だけバインドする - v-once
  • 6.3 要素にスタイルプロパティを設定する - v-bind:style
  • 6.3.1 複数のスタイル情報を適用する
  • 6.3.2 ベンダープレフィックスを自動補完する
  • 6.4 要素にスタイルクラスを設定する - v-bind:class
  • 6.4.1 v-bind:classのさまざまな設定方法
  • 6.5 {{...}}式による画面のチラツキを防ぐ - v-cloak
  • Part 7：コンポーネント
  • 7.1 コンポーネントの基本
  • 7.1.1 コンポーネントの定義
  • 7.1.2 コンポーネントの呼び出し
  • 7.1.3 テンプレートの制約［3］
  • 7.1.4 グローバル登録とローカル登録
  • 7.2 コンポーネントへのパラメーターの引き渡し
  • 7.2.1 プロパティ値の型を制限する
  • 7.2.2 検証ルールのさまざまな表現方法
  • 7.3 子コンポーネントから親コンポーネントへの伝達 - カスタムイベント
  • 7.3.1 カウンターアプリの例
  • 7.3.2 incrementイベントの実装
  • 7.3.3 カスタムイベントの監視
  • 7.3.4 カスタムイベントの検証
  • 7.4 コンポーネント配下のコンテンツをテンプレートに反映させる - スロット
  • 7.4.1 複数のスロットを利用する
  • Part 8：もっとコンポーネント
  • 8.1 大規模なコンポーネントを開発しやすく - Composition API［3］
  • 8.1.1 Composition APIの基本
  • 8.1.2 refによるデータ定義
  • 8.1.3 コードの共通化
  • 8.2 テンプレート配下のコンテンツを任意の場所に反映させる - Teleport［3］
  • 8.3 非同期処理の待ちメッセージを表示する - Suspense［3］
  • Part 9：ディレクティブ／プラグイン
  • 9.1 ディレクティブの自作
  • 9.1.1 ディレクティブの基本
  • 9.1.2 親コンポーネントの監視
  • 9.1.3 イベント処理を伴うディレクティブ
  • 9.2 プラグイン
  • 9.2.1 動作オプションの追加
  • Part 10：コマンドラインツールVue CLI
  • 10.1 Vue CLIのインストール
  • 10.2 プロジェクトの自動生成
  • 10.2.1 補足：アプリのビルド
  • 10.3 単一ファイルコンポーネント
  • 10.3.1 コンポーネントの定義 - <script>要素
  • 10.3.2 コンポーネント独自のスタイル - <style>要素
  • 10.3.3 補足：Veturプラグイン
  • Part 11：ルーティング
  • 11.1 ルーターの基本
  • 11.1.1 Vue Router環境のフォルダー構造
  • 11.1.2 ルーティング情報の定義
  • 11.1.3 ルーターの有効化
  • 11.1.4 トップページのテンプレート
  • 11.1.5 補足：プログラムからページ遷移
  • 11.2 パスの一部をパラメータ―として引き渡す - ルートパラメーター
  • 11.2.1 ルートの優先順位
  • 11.2.2 ルートパラメーターの記法
  • 11.3 複数のビュー領域を設置する
  • 11.4 入れ子のビューを設置する
  • Part 12：Vuex
  • 12.1 Vuexの組み込み
  • 12.2 Vuexによるカウンターアプリ
  • 12.3 Vuexストアの構成要素
  • 12.3.1 ステート値を加工／演算する - ゲッター
  • 12.3.2 ステート値を更新する - ミューテーション
  • 12.3.3 非同期処理を実装する - アクション
  • 12.3.4 補足：Vuexストアの構成要素
  • Appendix Vue.js 3での変更点
  • Vueクラスの初期化
  • dataオプションの記述
  • Global APIの変更
  • キー修飾子（キーコード）の廃止
  • フィルターの廃止
  • その他の追加／変更点

正誤表

該当頁 該当箇所 修正刷
訂正箇所 訂正事項 更新日
p.- 4.2.1項 本文 -
既定で文字列と見なされますが （それは type="number"からの入力でも同じです） 既定で文字列と見なされますが

括弧の文を削除		 2022/07/21

FAQ

現在、FAQはありません。

お問い合わせ

書籍に関するご質問や誤りのご報告、ご意見・ご感想などをお寄せください。

Powered by メールフォーム 『オレンジフォーム』