Vue创建实例

最新推荐文章于 2024-07-06 22:22:10 发布

Take^that

最新推荐文章于 2024-07-06 22:22:10 发布

阅读量298

点赞数

分类专栏：前端文章标签： Vue实例

本文链接：https://blog.csdn.net/qq_37767455/article/details/102303316

版权

前端专栏收录该内容

85 篇文章 0 订阅

订阅专栏

点击谈出对话框：
在这里插入图片描述

<body>
    <div id='root'>
        <!-- 绑定的 handleClick方法必须定义在methods里面 
            v-on:可简写为 @-->
        <div @click="handleClick">
            {{message}}
        </div>

        <item></item>
    </div>

    <script>
        // 定义全局组件
        Vue.component('item', {
            template: '<div>you need to calm down</div>'
        })
        
        var vm=new Vue({  //创建Vue实例
            el: '#root',   // Vue实例接管的区域       
            data: {
                message: 'youth is wasted on the young'
            },
            methods: {
                
                handleClick: function() {
                    alert("Today is the best gift,enjoy it !")
                }
            },
        })

    </script>
</body>