VUEJS Day01快速了解

Vue.js是一套构建用户界面的渐进式JavaScript框架。与其他重量级框架不同的是
，Vue采用自底向上增量开发的设计。Vue的核心库只关注视图层，它
不仅易于上手，还便于与第三方库或既有项目整合，另一方面，当与单文件组件
和VUe生态系统支持的库结合使用时，Vue也完全能够为复杂的
单页应用程序（spa：single page web application）提供驱动

什么是单页面应用：

单页Web应用就是只有一张web页面的应用，单页应用程序
是加载单个HTML页面并在用户与应用程序交互时动态更新该页面的Web应用程序。浏览器一开始
会加载必须的html，css，JavaScript，所有的操作都在这张页面上完成，
都由JavaScript来控制

优点：
1，分类前后端关注点，前端负责界面显示，后端负责数据存储和计算
2，减轻服务器压力，服务器只用出数据，不用展示逻辑和页面合成
3，同一套后端程序代码，不用修改就可以用于web界面，手机，平板等多种客户端

缺点：
1，SEO问题，现在可以通过Prerender等技术解决一部分
2，前进，后退，地址栏等，需要程序进行管理

Vue技术栈vue+vuex+vue-router+elementui+axios
Vue全家桶:vue+vuex+vue-router+elementui/miniui+axios

三大框架：vue，react，angular

MVC:model ， view ， controller 整个网站开发的框架(包括前后台)
MVVM：只是视图层中一个架构
m:model(js对象),v:view(页面显示)，viewmodel（vue提供，简称vm）
特点：双向数据绑定

面试：如何实现双向绑定（object.defineProperty）

3.vue api
全局属性，全局方法
实例属性，实例方法
new Vue({
el:’’,
data:{}
})

注：1，vue2.x中el不能挂在与上
var app = new Vue({
el:‘div’,
data:{
message:‘hello vue.js’
}
})
var app = new Vue({

data:{
    message:'hello vue.js'
}

}).$mount(’#app’)

实例属性
vm.$elvm.$data
实例方法
vm.$mount()---手动挂载vm.$set() 改完值会重新渲染
vm.$watch()vm.$nextTick()

4，指令
v-text

v-html

v-show

用于元素的显示和隐藏，不管是否显示，都会进行渲染 v-if

用于元素的显示和隐藏，为true的时候渲染，为false不渲染 v-else

v-else if

v-for

v-bind
可以绑定任意属性，简写为":"

v-model

5，vue实例对象生命周期（钩子）
创建前
创建后

挂载前
挂载后

更新前
更新后

销毁前
销毁后

6，事件
v-on：事件
简写@
添加各种事件修饰符

7，过滤器
vue2.0版本取消了1.0中的默认过滤器

1,全局过滤器
vue.filter(‘过滤器的名称’,function(value){

})
2,vue实例上的filter属性
new Vue ({
el:’’,
data:{},
methods:{},
filters:{}
})

8,计算属性
必须通过函数来返回数据，用来获取值，被称为get函数
计算属性，根据它的依赖来更新，只有依赖发生变化，才会进行更新
否则，