フレームワーク
Vue.js クイックリファレンス
Vue.js クイックリファレンス の印刷用チートシート。すばやい参照、学習、机上利用向けに整理されています
サンプル
このチートシートの内容
- テンプレート構文
- リアクティビティ
- 算出プロパティとウォッチャー
- コンポーネント
- プロップとイベント
- スロット
- Composition API
- ルーター(Vue Router)
- ライフサイクルフック
- リストと条件
- フォーム処理
テキストと式
<span>{{ message }}</span>
<span>{{ count + 1 }}</span>
<span>{{ ok ? 'Yes' : 'No' }}</span>
<span v-html="rawHtml"></span>
ディレクティブ
{{ expr }} | テキスト補間 |
v-bind:attr / :attr | 属性を式にバインド |
v-on:event / @event | イベントリスナーをアタッチ |
v-model | 双方向バインディング(フォーム) |
v-if / v-else-if / v-else | 条件付きレンダリング |
v-show | display CSS を切り替え(DOM に残る) |
v-for | リストレンダリング |
v-slot / #name | 名前付きスロットコンテンツ |
属性バインディング
<img :src="imageUrl" :alt="desc" />
<div :class="{ active: isActive }"></div>
<div :style="{ color: textColor }"></div>
<button :disabled="isLoading">Submit</button>
すべてのセクションを含む印刷用チートシートをダウンロード
PDF をダウンロードダウンロード