0
0

More than 1 year has passed since last update.

マウントする要素 Vue備忘録#1

Last updated at Posted at 2022-01-02

気づいたこと

初めてVueの本を買ってサンプルコードをいじっていたところ、jsファイルのel:直後の'#...'と、
htmlファイルの[div id=...]の名前が同じじゃないといけないことに気づいた。

「el」はマウントする要素
らしいけど、要はどのhtmlの要素とつなげるかって感じ。

main.js
var app = new Vue({
    el: '#aha',
    data: {
        message: '初期メッセージ'
    }
})
index.html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8">
    <title>Vue.js app</title>
    <link rel="stylesheet" href="main.css">
</head>
<body>
    <div id="aha">
        <p>{{ message }}</p>
        <input v-model="message">
    </div>
    <script src="vue.js"></script>
    <script src="main.js"></script>
</body>
</html>
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0