Vue.js入门（vue.js安装、入门小程序、MVVM）

什么是vue.js？

vue是前端的一套构建用户界面的渐进式框架

 

什么是渐进式框架？

渐进式框架：就是可以将vue作为应用的一部分嵌入其中

 

为什么需要学习vue.js？

通过尽可能简单的API实现响应的数据绑定和组合的视图组件

 

如何安装vue.js？

1、直接CDN引入

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">script>

 

2、下载和引入

开发环境 https://vuejs.org/js/vue.js 

生产环境 https://vuejs.org/js/vue.min.js

 

3、npm安装

$ npm install vue

 

如何用vue实现一个小功能？

实例代码：

    

    









    
{{message}}

 

计数器代码实例：

    

    







    
当前计数：{{counter}}

    +

    -

 

实例说明：

1、引入vue.js的依赖文件

2、实例化vue

3、将vue实例和dom元素进行关联

4、获取数据

5、绑定事件

 

数据是如何传递和展示的呢？

View：DOM（展示数据）

Model：Data（数据层）

VueModel：Listener、Binding（通过监听和绑定完成Model和View间的沟通）