
Vue.js基礎・実践 問題集
Vue 2/3の基本概念、Options/Composition API、ディレクティブ、ライフサイクルに関する問題です。
全 32 問 ・ 11 タグ
Vue.js基礎・実践 ランダムクイズ
問題数を選んでランダムに出題
Vue.js基礎・実践の問題一覧
該当件数32件
「v-if」と「v-show」の決定的な違いは?
テキスト補間(Interpolation)に使用される構文は?
Vue 3のComposition APIにおいて、コンポーネントのロジックを記述するエントリーポイントとなる関数は?
Vue 3でプリミティブな値(数値や文字列)をリアクティブにするために推奨される関数はどれか?
DOM要素にアクセス可能になるライフサイクルフックは?
算出プロパティ(computed)とメソッド(methods)の主な違いは?
v-forディレクティブを使用する際、必須で指定すべき属性は?
イベントの伝播(バブリング)を止めるためのイベント修飾子は?
フォーム入力とデータを双方向バインディングするためのディレクティブは?
Vue 3で導入された、コンポーネントが複数のルートノードを持つことができる機能は?
親コンポーネントから子コンポーネントへデータを受け渡す仕組みは?
コンポーネントのHTMLを、DOMツリーの別の場所(body直下など)にレンダリングするVue 3の機能は?
Vue 2の「destroyed」ライフサイクルは、Vue 3で何という名前に変更されたか?
Vueの公式状態管理ライブラリとして、Vuexの後継として推奨されているものは?
データの変更後、DOMの更新が完了するのを待ってから処理を実行するメソッドは?
コンポーネント内のCSSをそのコンポーネントだけに適用させるための属性は?
Vue Routerにおいて、ページ遷移のためのリンクを作成するコンポーネントは?
Vue 3において、特定のデータの変更を監視する「watch」と、依存関係を自動収集する「watchEffect」の違いは?
Options APIと比較した際のComposition APIの主なメリットは?
Cannot read properties of undefined (reading 'xxx') をVueで頻繁に見る場合
Vuetifyアプリケーションを正しく動作させるために、テンプレートの一番外側(ルート)に配置しなければならない必須コンポーネントは?
Vuetifyのグリッドシステム(v-row, v-col)において、画面の横幅全体は何分割のカラムとして扱われるか?
マージンやパディングを設定するユーティリティクラス「ma-4」において、「a」が意味する方向は?
Vue.jsで要素を表示・非表示にする際、条件が false の場合に要素をDOMから完全に削除するディレクティブはどれか?
<input> 要素などで、データの「表示」と「入力による更新」を自動的に同期させる(双方向バインディングを行う)ディレクティブは?
Vue.jsにおいて、v-bind ディレクティブを使って src 属性に動的な値を設定する記述 v-bind:src="imageSrc" を、省略記法(シンタックスシュガー)を使って書き換えたものはどれですか?
Vue.jsのコード例や慣例において、new Vue({...}) で作成したインスタンスを格納する変数名としてよく使われる vm は、何の略称ですか?
Vueのコンポーネントにおいて、data オプションを単なるオブジェクトではなく、関数(オブジェクトを返す関数) として定義しなければならない主な理由はどれですか?
Vue.jsで v-bind ディレクティブを使用する際、「v-bind' directives require an attribute value」エラーが発生する原因として最も適切なものはどれですか?
Vuetifyコンポーネントにおける v-slot の主な役割として正しいものはどれか?
Vue.jsにおいて、リアクティブなデータ(例:`isVisible = true`)を変更し、新しく表示されたDOM要素(`<input>`など)に対して即座にフォーカスを当てたいと考えています。このとき、意図した通りに動作する実装方針とその理由として正しいものはどれですか?
Vuetify 3 で次のような横並びレイアウトを作っています。子要素同士の間に均等な余白を空けたいとき、最も適切なクラスはどれですか? <div class='d-flex ___'> <v-btn>A</v-btn> <v-btn>B</v-btn> <v-btn>C</v-btn> </div>
Vue.js基礎・実践とは
Vue.jsは、Evan You氏が開発したプログレッシブJavaScriptフレームワークです。段階的に導入できる設計思想が特徴で、小規模なプロジェクトから大規模なSPA(Single Page Application)まで幅広く対応できます。Vue 3ではComposition APIが導入され、TypeScriptとの親和性やロジックの再利用性が大幅に向上しました。
なぜVue.js基礎・実践を学ぶべきか
Vue.jsは学習コストが低く、公式ドキュメントが充実しており、日本語ドキュメントも整備されています。日本の開発現場でも採用事例が多く、特にスタートアップや中小規模のプロジェクトで人気があります。ReactやAngularと並ぶ三大フレームワークの一つとして、求人市場でも需要があります。
出題トピック
Options API と Composition API
Vue 2のOptions APIとVue 3のComposition API(setup関数、ref、reactive等)の違いと使い分けを出題します。
テンプレート構文とディレクティブ
v-bind、v-model、v-if/v-show、v-for、v-onなどのディレクティブとテンプレート構文について扱います。
コンポーネント設計
props、emit、slot、provide/injectを使ったコンポーネント間のデータ受け渡しパターンを問います。
リアクティブシステム
Vueのリアクティブシステムの仕組み、computed、watch、watchEffectの使い分けについて学びます。
こんな方におすすめ
- フロントエンド開発をこれから学び始める方
- Vue 2からVue 3への移行を検討しているエンジニア
- Composition APIの使い方を習得したい方
- NuxtやVuetifyなどのVueエコシステムを活用したい方