这份Vue.js你值得拥有,写完老板叫我转前端

Vue.js

  • 1:概述
    • 1-1:MVVM模式的实现者
    • 1-2:为什么要使用Vue.js
  • 2:第一个Vue程序
    • 2-1:下载地址
    • 2-2:代码编写
    • 3-2:Vue的闪烁问题
    • 3-3:解决方案
  • 4:Vue的基本语法
    • 4-1:v-bind
    • 4-2:判断:v-if,v-else-if,v-else
    • 4-3:循环:for
  • 5:Vue的绑定事件v-on
  • 6:Vue双向绑定
    • 6-1:为什么要实现数据的双向绑定
    • 6-2:在表单中使用双向数据绑定
    • 6-3:单行文本
    • 6-4:多行文本
    • 6-5:单选按钮
    • 6-6:复选框
    • 6-7:下拉单选框
    • 6-8:下拉多选框
  • 7:Vue组件
    • 7-1:组件的组织
    • 7-2:组件的注册
    • 7-3:组件的值传递,通过 Prop 向子组件传递数据
    • 7-4:子组件自定义变量data
  • 8:Axios异步通信
    • 8-1:什么是Axios
    • 8-2:为什么要使用Axios
    • 8-3:第一个Axios应用程序
  • 9:计算属性computed
  • 10:插槽slot
  • 11:自定义事件
  • 12:第一个vue-cli项目
    • 12-1:什么是vue-cli
    • 12-2:需要的环境
      • 12-2-1:Node.js
      • 12-2-2:npm命令解释
      • 12-2-3:安装淘宝镜像加速器(cnpm)
      • 12-2-4:Git
      • 12-2-5:vue-cli
    • 12-3:第一个vue-cli应用程序
      • 12-3-1:创建vue-cli项目
      • 12-3-2:初始化并运行
    • 12-4:Webpack
      • 12-4-1:什么是Webpack
      • 12-4-2:模块化的演进
    • 12-4-3:安装Webpack
    • 12-4-4:配置
    • 12-4-5:使用webpack
  • 13:vue-router路由
    • 13-1:说明
    • 13-2:安装
    • 13-3:使用
  • 14:vue+elementUI
    • 14-1:创建工程
    • 14-2:使用elementUI
      • 14-2-1:idea打开我们所建项目
      • 14-2-2:配置好路由
      • 14-2-3:使用elementUI
  • 15:路由嵌套,参数传递及重定向
    • 15-1:路由嵌套
    • 15-2:参数传递
    • 15-3:重定向
    • 15-4:路由模式
    • 15-5:404页面
    • 15-6:路由钩子,结合axios模拟实现腾讯的404找人页面

Idea安装Vue.js插件
这份Vue.js你值得拥有,写完老板叫我转前端_第1张图片

1:概述

官网地址:https://cn.vuejs.org/

Vue(读音 /vju/ ,类似于view) 是一套用于构建用户界面的渐进式框架,发布于2014年2月。与其他大型框架不同的是,Vue被社会组为可以自底向上逐层应用。集于Angular的模型层Vue的核心只关注视图层,不仅易于上手,还便于与第三方库(如:vue-router,vue-resourcee,vuex)或既有项目整合

1-1:MVVM模式的实现者

MVVM源自于经典的MVC(Model-View-Controller)模式。MVVM的核心是ViewModel层,负责转换Model中的数据对象来让数据变得更容易管理和使用,其作用如下:
这份Vue.js你值得拥有,写完老板叫我转前端_第2张图片

  • Model:模型层,在这里表示JavaScript对象
  • View:视图层,在这里表示DOM(HTML操作的元素)
  • ViewModel:连接视图和数据的中间件,Vue.js就是MVVM中的ViewModel层的实现者,能够观察到数据的变化,并对视图对应的内容进行变更,能够监听到视图的变化,并能够通知数据繁盛改变

1-2:为什么要使用Vue.js

  • 轻量级,体积小是一个重要指标。Vue.js压缩后只有20多kb(Angular压缩后56kb+React压缩后44kb+)
  • 移动优先,更适合移动端,比如移动端的Touch事件
  • 易上手,学习曲线平稳,文档齐全

2:第一个Vue程序

【说明】IDEA可以安装Vue的插件

  • 注意:Vue不支持IE8及以下版本,因为Vue使用了IE8无法模拟的ECMAScript5特性。但它支持所有兼容ECMAScript5的浏览器。

2-1:下载地址

开发版本

  • 包含完整的警告和调试模式:https://vuejs.org/js/vue.js
  • 删除了警告,30.96kb min + gzip:https://vuejs.org/js/vue.min.js

CDN

你可能感兴趣的:(Vue,Vue,NodeJS,axios,后端)