Vue.js是什么

Vue(读音/vju:/,类似view)是一套用于构建用户界面的渐进式框架。以前学习JQuery编程叫命令式编程,学习vue编程,叫声明式编程。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用

前端三大框架之一

Vue框架:作者尤雨溪,创建了全世界三大前端框架之一,领先于React和Angular

2013年,在Google工作的尤雨溪,收到Angular的启发,开发了一款轻量框架,最初命名Seed

设计思想:是一种“渐进式框架”,淡化框架本省的主张,降低框架作为工具的复杂度,从而降低对使用者的要求

起步

官方指南假设你已了解关于 HTML、CSS 和 JavaScript 的中级知识。如果你刚开始学习前端开发,将框架作为你的第一步可能不是最好的主意——掌握好基础知识再来吧!之前有其它框架的使用经验会有帮助,但这不是必需的。

尝试Vue.js最简单的方法是使用hello world例子,引用vue文件

1
2
3
4
5
6
<!-- 开发环境版本,包含了有帮助的命令行警告,利于初学者 --> 
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<!-- 生产环境版本,优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>

Vue.js的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进DOM的系统:

1
2
3
<div id="app">
{{message}}
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
const app = new Vue({
el:'#app',
data:{
//存放数据
message:'Hello Vue'
},
methods:{
//写方法
},
computed:{
//属性方法,有缓存
},
components:{
//声明子组件
}
})

以上一个简单的Vue实例,写了基本的Vue语法,使用的是Mustach语法,用来显示Vue实例的数据,但是容器需要捆绑id,接下来我会一步步记录Vue的学习笔记

学习内容

  1. Vue基础知识
  2. Vue数组应用
  3. Vue基础指令
  4. Vue组件化开发
  5. 学习Webpack打包工具
  6. 掌握开发项目Vue-CLI脚手架
  7. 掌握Vue路由
Vue2.x官方文档 Vue3.x官方文档 Vue框架学习目录