主流框架：Vue框架笔记

一、vue框架基础

jQuery与vue的区别

     vue，拥有DOM虚拟，高效操作，便于维护；
     jQuery:直接操作DOM，消耗性能，不便于维护；
Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。

vue渐进式框架
`` 指令：指令的值必须是表达式，不能是语句

【文本类指令】

 	v-text： 用于把文本的值渲染在DOM上，比如字符串或者数值
	{
  { }} :  也可以把字符串或数值渲染在DOM上，其缺点是有{
  { }}一闪而过的问题；
	v-html ： 用于渲染纯html字符串，浏览器可以解析这些字符串，可以防止 XSS ，CSRF攻击；
	v-once ： 也是用于绑定文本的，但只渲染一次，它所绑定的变量即使发生了变化，DOM不更新；

【v-bind】简写“  ： ”
	v-bind：用于绑定HTML标签的自有属性
【 v-on  】简写“  @ ”
	v-on ：用于绑定js事件处理器
@keyup.enter 绑定键盘事件，enter是事件修饰符，表示监听键盘的 Enter键

【v-model】
 	v-model，用于绑定表单，可以让我们非常方便地取到表单的值
【v-for】
	 v-for : 的第一个作用，就是用于列表数据的渲染，其语法
	 v-for=‘(item,index) in array'
     v-for 还有另一个作用，用于对象数据的遍历渲染
【v-show】
	v-show ：用来实现动态显示/隐藏
【v-if】
	「v - else - if」:用来辨别
【 else】
   v-once  也是用于绑定文本的，但只渲染一次，它所绑定的变量即使发生了变化，DOM不更新

二、事件修饰符：

深入v-on；
	.stop  阻止冒泡
	.prevent 阻止HTML标签的默认行为
 事件修饰符可以链式调用@keyup.ctrl.shift=‘a’

表单表三个修饰符(v-model:绑定表单）

     .trim 把文本类表单绑定的值，去除前后的空字符串
     .number 可把文本类数字字符，自动转化成数值类型
     .lazy 这个修饰符的作用，当表单失焦时，才同步更新 data中被绑定的变量，以达到性能优化的目的
  表单在使用，v-model绑定的变量是什么数据类型，务必搞清楚

动态样式  v-bind:class  v-bind:style
     :class  ='' 是一组 class类名
     :style  ='' 是一组 “css属性-css属性值”的键值对

三、环境搭建 ( 5步骤)

第1步：安装
node.js
去node.js官网下载windows对应版本，安装即可。
验证node.js是否安装成功：
node -v
npm -v

第2步：解决npm安装第三方模块很慢问题，建议使用cnpm淘宝镜像
官网地址：

# 全局安装cnpm这个工具
# -g 表示全局安装，一次安装，永久使用
npm install -g cnpm --registry=https://registry.npm.taobao.org

第3步：安装vue脚手架工具

# -g 表示全局安装
cnpm install @vue/cli -g

第4步：创建vue项目