Vue是web前端快速搭建网站的框架之一。它与jQuery有所不同，是以数据驱动web界面（以操作数据改变页面，而jQuery是以操作节点来改变页面），同时，vue还实现了数据的双向绑定，可及时响应用户的输入。最主要的是vue的写法简单，容易掌握，组件形式可以大大提高工作效率。
对于vue的使用可以分为两种使用形式：1.引入vue.js文件，在js中将vue实例化；2.通过node安装第三方包--vue，搭建脚手架，用脚手架将页面分成几个组件编写，从而利用组件来搭建页面。
引入vue.js的写法
Vue分为V层（视图层）和M层（数据层），一般都是由M层的数据来驱动V层的改变。而vue的常用指令数量不多且写法简单。常用的有v-html、v-text、v-show、v-if、v-else、v-for、v-bind:、v-model。v-html和v-text都是将数据写进标签内，但它们的不同之处在于v-text会将标签当做文本内容写入
，而v-html则会对标签进行编译，只显示标签内的内容。
至于v-show、v-if、v-else这三个指令都是通过布尔值的判断来执行的，当布尔值为真时，设置了v-show、v-if指令的标签会显示出来，当布尔值为假时，标签隐藏；而v-else与这两个指令相反。除此之外，v-show和v-if、v-else之间也有差别，v-show是改变标签的display属性来使标签显示或隐藏；而v-if、v-else是通过添加或删除节点，来显示或隐藏标签的。
V-for是vue的一种遍历方法，这个方法极大的简化了数组或对象的遍历并显示到页面的步骤
而v-bind：是对html属性或自定义属性的数据驱动方式，格式为v-bind:href，可简写为：href。对于类（class）的操作是通过布尔值来判断增加或者隐藏类，同时。类和样式（style）所接受的数据类型为对象。
V-model指令的作用是将数据进行双向绑定，仅限于输入类型标签。当用户在页面输入时，数据层的数据会跟着改变。这是VM模式。由v驱动m。
除了这些普通的指令之外，还有事件指令v-on:，可简写为@+事件名，例如：@click，并将执行函数写到vue的methods中
通过脚手架来写项目的话，可用通过写组件，再将组件引入（注册）到另一个vue文件里拼接在一起，从而构建出一个页面。
（组件书写格式）
（组件整合）
（注册路由）
路由是通过vue-router来实现的，在注册路由的时候要将router实例化。不同的路由跳转不同的页面，这是搭建单页面应用的优势。
而父组件与子组件之间的通讯可以通过props将父组件的信息传递给子组件，改变子组件的内容，这样子组件的复用就不会有障碍了，而子组件传递信息给父组件或者其他组件的通讯则需vuex。
通过引入vuex并实例化一个Vuex.Store作为一个公共平台，将数据进行传输。通过vue的computed方法接收数据，通过methods方法改变数据。而这个公用平台可以实现组件与组件之间的信息传递，从而实现组件之间的交互。
通过一个星期的实战，深深的体会到了vue的优势，在构建移动端这方面的效率很高。但在搭建的过程中，还是少不了与jQuery结合，毕竟每个工具都有其优点，择其优而用是明智的选择。
使用框架时必须熟知框架指令特性！很重要；
Bootstrap+jQuery是很好的选择！
库： 1.i18n(双语言切换)；
2.vue-router(路由）；
3.vuex(状态管理，需要进行双语言切换监听变化)；
4.ElementUI(饿了么以电脑端为主得UI框架)；
5.sass(css预处理)；
6.echarts(需要K线图，个人推荐不要用echarts,太大)；
7.axios(相对于fetch兼容性好，请求数据)
IE的坑：1.走马灯之前用的是swiper的，结果兼容性不好，4.0+兼容不好，3.0主要以移动端为主，
之后换成了ElementUI的走马灯又引导出无法覆盖ElementUI的样式，因为VUE是默认全局覆盖局部，再加一个style，不要加scoped,ElementUI是全局引入！ 解决问题。
2.经验不足，IE9不支持flex,坑、坑、坑移动端写习惯了！
3.多行文本省略只支持webkit内核浏览器，又是坑，用js控制长度搞定！
4.低版本兼容引入babel-polyfill，将build webpack.base.conf.js里entry修改为entry: {'babel-polyfill': 'babel-polyfill',app: './src/main.js'},
5.使用axios低版本兼容 es6-promise包，在main.js里引用
import promise from 'es6-promise'
promise.polyfill()
打包：1.history模式：需要服务器端配置请看官网https://router.vuejs.org/guide/essentials/history-mode.html#example-server-configurations；不需要改任何东西，路由里加mode:history即可
2.hash模式：将config里index.js里的 assetsPublicPath: '/' 改为assetsPublicPath: './',即可访问静态资源；
3.打包体积：将config里index.js里的productionSourceMap: true, 改为 productionSourceMap: false，或者待打包完之后手动删除Map文件；
4.路由懒加载（具体看官网很简单）；
5.第三方包分离将build webpack.base.conf.js里添加
externals:{；
'echarts':"echarts"
},
6.打包后css背景图无法访问，将build utils.js里添加 publicPath: '../../',
7.sass配置（webpack.base.conf.js）
{ test: /\.scss$/, loaders: ["style", "css", "sass"]},
如有写错的地方欢迎大家评论
