Vue入门 Demo5 Vue实例

最新推荐文章于 2022-12-16 17:44:43 发布

城南花已开呀

最新推荐文章于 2022-12-16 17:44:43 发布

阅读量150

点赞数

分类专栏： Vue

本文链接：https://blog.csdn.net/qq_36778310/article/details/104650662

版权

Vue 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

Vue入门 Demo5 Vue实例

<!DOCTYPE html>
<html lang="en"> 
    <head> 
        <meta content="text/html; charset=utf-8" /> 
        <title>Vue实例</title> 
        <script src="./vue.js"></script>
    </head> 
    <body> 
       <div id="root">
           <div @click="handleClick">
             {{message}}
           </div>    
       </div>

       <script>
           //vm通常指的就是vue实例 每一个组件就是一个实例,并且实例中将拥有很多方法以及属性
           var vm = new Vue({
               el: '#root',
               data: {
                   message: "hello world",
               },
               methods: {
                handleClick: function(){
                    alert("hello click");
                }
               }
           })
       </script>
    </body> 
</html>