一、vue是什么
1、构建用户界面的渐进式框架。
2、关注视图层, 采用自底向上增量开发的设计。
3、通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。
二、渐进式怎么理解:
Vue的核心的功能,是一个视图模板引擎,但这不是说Vue就不能成为一个框架。如下图所示,这里包含了Vue的所有部件,在声明式渲染(视图模板引擎)的基础上,我们可以通过添加组件系统、客户端路由、大规模状态管理来构建一个完整的框架。更重要的是,这些功能相互独立,你可以在核心功能的基础上任意选用其他的部件,不一定要全部整合在一起。可以看到,所说的“渐进式”,其实就是Vue的使用方式,同时也体现了Vue的设计的理念。
三、NPM
1、含义:NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题
2、安装:http://nodejs.cn/download/
3、安装淘宝npm(cnpm):npm install -g cnpm --registry=https://registry.npm.taobao.org
4、具体安装手册:https://www.cnblogs.com/liaojie970/p/9296177.html
5、NPM介绍:https://www.runoob.com/nodejs/nodejs-npm.html
四、学习资料
1、官网:https://cn.vuejs.org/v2/guide/
2、学习视频:https://learning.dcloud.io/#/
3、菜鸟教程:https://www.runoob.com/vue2/vue-tutorial.html
4、常用指令:https://www.cnblogs.com/le220/p/9501071.html
五、常用指令
1 v-model 多用于表单元素实现双向数据绑定(同angular中的ng-model)
2 v-for 格式: v-for="字段名 in(of) 数组json" 循环数组或json(同angular中的ng-repeat),
3 v-show 显示内容 (同angular中的ng-show)
4 v-hide 隐藏内容(同angular中的ng-hide)
5 v-if 显示与隐藏 (dom元素的删除添加 同angular中的ng-if 默认值为false)
6 v-else-if 必须和v-if连用
7 v-else 必须和v-if连用 不能单独使用 否则报错 模板编译错误
8 v-bind 动态绑定 作用: 及时对页面的数据进行更改
9 v-on:click 给标签绑定函数,可以缩写为@,例如绑定一个点击函数 函数必须写在methods里面
10 v-text 解析文本
11 v-html 解析html标签
12 v-bind:class 三种绑定方法
a、对象型 '{red:isred}'
b、三元型 'isred?"red":"blue"'
c、数组型 '[{red:"isred"},{blue:"isblue"}]'
13 v-once 进入页面时 只渲染一次 不在进行渲染
14 v-cloak 防止闪烁
15 v-pre 把标签内部的元素原位输出