1、Vue.js 是什么

是一套用于构建用户界面的渐进式框架。

与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。

另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

• 优点

1. 体积小，轻量级框架
   压缩后33K
2. 更高的运行效率
   基于虚拟dom，一种可以预先通过的JavaScript进行各种计算，把最终的Dom操作计算出来并优化，由于这个DOM操作属于预处理操作，并没有真实的操作DOM，所以叫做虚拟DOM。
3. 双向数据绑定
   让开发者不在去操作dom对象，把更多的经历投入到业务逻辑上；
4. 丰富生态，学习成本低

2、Vue 两个版本

分别是完整版和不完整版

2.1、完整版

vue.js：同时包含编编译器(compiler) 和 运行时(runtime)的版本

2.2、不完整版

vue.runtime.js：只包含运行时的版本

2.3、区别

	Vue完整版	Vue只包含运行时版
特点	有compiler	没有compiler
视图	写在HTML里，或者写在template选项里	写在render函数里，用h创建标签
cdn引入	vue.js	vue.runtime.js
webpack引入	需要配置alias	默认使用
vue@cli引入	需要额外配置	默认使用

3、template 和 render 怎么用

3.1、template:

在vue文件中，template的作用是模板占位符，可帮助开发者包裹元素，可创建组件模板内容；但在循环过程当中，template不会被渲染到页面上。

3.2、render：

Render 函数是 Vue2.x 新增的一个函数、主要用来提高节点的性能，它是基于 JavaScript计算。使用 Render 函数将 Template 里面的节点解析成虚拟的 Dom。

• 怎么用

如果需要在客户端编译模板，或挂载到一个元素上并以其 DOM 内部的 HTML 作为模板)，就将需要加上编译器，即完整版：

// 需要编译器
new Vue({
  template: '<div>{{ hi }}</div>'
})

// 不需要编译器
new Vue({
  render (h) {
    return h('div', this.hi)
  }
})

如何用 codesandbox.io 写 Vue 代码

进入 codesandbox.io，创建沙盒，选择vue

选择左上角三条杠 打开Files => Export to ZIP 下载到本地，解压之后直接用代码编辑器打开即可