問題

6
Vue.js

コンポーネントを読み込んでみよう!

Vue.jsの問題に挑戦しよう!

問題

コンポーネントを読み込んでみよう!

Vueコンポーネントを読み込んでみよう。
templeteに'

This is NinjaCode Component!

'を持つvueファイルを
コンポーネントとして読み込み、画面に出力してほしい。

あらかじめエディタに書くコード

                    --- App.vue
<template>
  <div id="app">
    <ninjacode>
  </ninjacode></div>
</template>
¥Vue¥
                
                    --- NinjaCode.vue
<template>
  <div>
    <h1>This is NinjaCode Component!</h1>
  </div>
</template>
¥Vue¥
                

期待する画面

解答の画像

解答と解説(コンポーネントを読み込んでみよう!)

解説

LINE登録して解答を見る

※ご登録後トークルーム下部にあるメニュー内
「無料問題集※解答付き」を押すと
解答閲覧用URLが届きます

まずは'import'と'components'用いてvueファイルをコンポーネントとして読み込もう。
''とすればコンポーネントを画面に出力することができるぞ。

さらにスキルアップしたい方は公式LINEから「Vue.js」と送信すると動画が見れます。

LINE登録して動画を視聴する
あなたに合った学習プランは?LINE適正コース診断はこちら
最大100,000円OFF 対象期間中に初めて無料相談にお申し込みされた方へ 無料相談はこちら