More than 1 year has passed since last update.

vue3入門①

Vue3

Posted at 2021-12-02

vue3の基本構文①
オブジェクト作成からマウントまで
コード内に流れを記載。

<!DOCTYPE html>
<html>

<head>
    <title>My first Vue app</title>
    <script src="https://unpkg.com/vue@next"></script>
</head>

<body>
    <h1>Vue3</h1>
    <div id="app">
        <!--④appdataオブジェクトのアプリケーションからmessageを表示 -->
        {{ message }}
    </div>

    <script>
        //①appdataにdata内のmessageを代入
        const appdata = {
            data() {
                return {
                    message: 'Hello World'
                }
            }
        }
        //②Vue.createApp(appdata)→appdataオブジェクトをつかってアプリケーションを作成
        //③.mount('#app')→アプリケーションを#appにマウントする
        Vue.createApp(appdata).mount('#app')
    </script>
</body>

</html>

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up