問題
2
Vue.js
Hello NinjaCode!
Vue.jsの問題に挑戦しよう！
問題
「Hello NinjaCode!」
今度はVue使って{{ message }}に見本のような文字列を表示させてみよう。
Vueを使うためには[CDN]というものをhtmlファイルに読み込ませなければならないから
注意してほしい。
あらかじめエディタに書くコード
<div id="app">
{{ message }}
</div>
<style>
#app {
font-size: 3rem;
font-weight: bold;
text-align: center;
margin: 30% auto;
color: #41BA83;
}
</style>
¥Vue¥
期待する画面
解答と解説（Hello NinjaCode!）
解説
LINE登録して解答を見る
※ご登録後トークルーム下部にあるメニュー内
「無料問題集※解答付き」を押すと
解答閲覧用URLが届きます
Vueは "new Vue" でVueインスタンスが生成できるぞ。'el:'でターゲットを決めて、そのターゲットに
'data:' の 'message' の値を出力しているという流れだ。
Vueインスタンスの値は '{{ 値 }}' としなければ表示することができないことを覚えていてほしい。
