Vue

前端框架发展历史

html [1990]----> html5 [2008.1.12]

css 1.0 发布于1996年
css 2.0 发布于1998年
css 3.0 发布于2001年

EcmaScript
1997年诞生
2015 EcmaScript 2015
2016 EcmaScript 2016

vue 1.0 MVVM 2014/07

Vue 2.0   MVVM   2016/09

随着前端项目越来越复杂和难以维护，所以引进了后端的架构思想(MV*)
为什么前端要引入MVC?
- 为了项目的更新和维护
- 减轻视图的压力
- 为了更好的解决从服务器获取数据困难
- 为了更好的解决用户在视图中输入的数据如何更好的后台进行交互

M  Model      数据层
V  View       视图层
C  Controller 控制器 ( 业务逻辑 )        MVC
P  Presenter  提出者（ Controller 改名得来的 ） MVP
VM ViewModel  视图模型（ 业务逻辑  VM 是 由  P 改名得来的） MVVM

Vue如何使用？
可以通过script标签引入(初级)；
可以通过npm安装使用(高级)；

2016年重要的一年：
1. es6发布
2. vue2.0发布
3. angular2.0x发布
4. 微信小程序 / 微信小游戏

前端框架到底能干嘛？
1、渲染数据
2、操作DOM、
3、操作cookie等存储机制api

Vue框架：
它是尤雨溪的个人项目；是一个Js渐进式框架(越学越难)；

学习Vue的必要性：
Vue近几年来特别的受关注，三年前的时候angularJS霸占前端JS框架市场很长时间， 接着react框架横空出世，因为它有一个特性是虚拟DOM，从性能上碾轧angularJS， 这个时候，vue1.0悄悄的问世了，它的优雅，轻便也吸引了一部分用户，开始收到关注， 16年中旬，VUE2.0问世，这个时候vue不管从性能上，还是从成本上都隐隐超过了react，火的一塌糊涂 学习vue是现在前端开发者必须的一个技能

模板与法

我们想要在html结构中书写js,那么就需要模板语法(双大括号语法)；
指令其实就是封装的函数,这个函数绑定在元素身上， 那么就可以获取元素，然后就可以操作这个元素了
指令的目的是做什么： 操作DOM

<div id="app">
        <div index = 1 v-html = 'info'> </div>
    </div>
 <script>
    new Vue({
        el: '#app',
        data: {
            info: '算你狠'
        }
    })
</script>

v-html ：转义输出，也就是可以解析 xml 数据
v-text： 非转义输出，也就是无法解析 xml 类型数据
v-bind：将数据和属性进行单向数据绑定： 将vue中数据赋值给属性值
频繁切换： v-show
切换不频繁; v-if
v-if : <p v-if = "flag"> 你很衰 </p>
v-else-if: <p v-else-if = "type === 'B'"> B </p>
v-else: <p v-else> C </p>
v-show :<p v-show = "show_flag"> 你真的太好看了 </p>
v-model: <input type="text" v-model = "info">