Vue-1

旺仔来了

于 2024-04-19 16:13:07 发布

阅读量520

点赞数 10

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/weixin_45503872/article/details/137968562

版权

本文介绍了Vue.js的基本概念，包括数据驱动视图的原理，如何从GitHub获取Vue.js库，以及在HTML文件中引入Vue.js。重点讲解了2.1节的Vue插值语法，说明了{{}}双大括号用于渲染data中的属性或表达式，并强调不支持复杂的JavaScript逻辑判断。同时，指出了在Vue中自定义对象如content是无效的，所有数据应放在data对象内。

摘要由CSDN通过智能技术生成

vue的网址：https://github.com/vuejs Github网站

关于数据驱动视图的问题

首选我们看原生的JavaScript的代码

<body>
    <h1>
        0
    </h1>
    <button>按我加1</button>
    <button id="btn">按我减1</button>
    <script>
       var elH1 = document.getElementsByTagName("h1")[0];
       var elBtn = document.getElementsByTagName("button")[0];
       var elBtn2 = document.getElementById("btn");
       var num = 0;
       elBtn.onclick = function() {
        num ++;
        //重新绘制视图
        elH1.innerHTML = num;
       }

       elBtn2.onclick = function() {
        num--;
        elH1.innerHTML = num;
       }
    </script>
</body>

关于vue的数据驱动视图