vue垦荒记(1)--hello word_hello word summer test-CSDN博客

本文链接：https://blog.csdn.net/jzzszyj/article/details/79440750

话说，vue是个什么鬼？

vue是由帅锅锅尤雨溪开发维护的，2014年开源，相对于angular而言比较轻量、简单、易用。是个构建前段用户界面的轻量级mvvm框架，核心思想是数据驱动和组件化，2.0引入了虚拟DOM。与angular一样，不支持低版本的IE浏览器。

来个官网瞄瞄： [ vue中文官网 ]

废话不多说，上菜——我的第一个vue应用

下载vue

1、npm init --yes 生成package.json
2、cnpm install vue --save 下载vue（前期，为了方便学习，可以把里面的vue.js拷出来使用）或者直接<script src="https://cdn.jsdelivr.net/npm/vue"></script>
3、chrome上安装devtools拓展用于调试
4、上菜，考虑到现在还比较菜，先搞个hello word乐一乐（v-model 指令能轻松实现表单输入和应用状态之间的双向绑定）：

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="https://cdn.jsdelivr.net/npm/vue"></script> </head> <body> <div id="demo"> 用户名： <input type="text" v-model="name" /> <br> {{name}} </div> <script> new Vue({ el: '#demo', data: { name: 'demo' } }); </script> </body> </html>