Vue2.5开发去哪儿网App - 简书

352 阅读2分钟
原文链接: www.jianshu.com

第1章 课程介绍

第2章 Vue 起步

学习方法:具体知识点看官方文档
实现vuie.js的hello world
data:定义一些数据 el:限制vue实例处理的dom的范围
todolist
todolist-jq
前端组件化
全局组件和局部组件
简单的组件间传值
阅读官方文档介绍下的内容

第3章 Vue 基础精讲

Vue实例 vm.$destroy()
Vue实例生命周期函数
看官网Vue实例部分内容
Vue的模板语法
计算属性,方法和侦听器
计算属性的setter和getter
Vue的样式绑定
Vue中的条件渲染
Vue中的列表渲染
Vue中的set方法

第4章 深入理解 Vue 组件

组件使用的细节点
父子组件传值
组件参数校验与非props特性
给组件绑定原生事件
在vue中使用插槽
vue中的作用域插槽
动态组件与v-once指令

第5章 Vue 中的动画特效

Vue中CSS动画原理
在Vue中使用Animate.css库
在Vue中同时使用过渡和动画
Vue中的JS动画与Velocity.js的结合
Vue中多个元素或组件的过渡
Vue中的列表过渡
Vue中的动画封装

第6章 Vue 项目预热

项目环境准备

安装node.js lts
node -v
npm -v
码云
github配置公钥
vue官网CLI手脚架构建工程travel

#全局安装vue-cli
npm install --global vue-cli
#创建一个基于webpack模板的新项目
vue init webpack travel
cd travel
npm install
npm run dev
项目代码结构介绍
单文件组件与Vue中的路由
多页应用VS单页应用
项目代码初始化

第7章 项目实战 - 旅游网站首页开发

首页header区域开发

npm install stylus --save npm install stylus-loader --save

iconfont的使用和代码优化
首页轮播图

学习使用vue-awesome-swiper

图标区域页面布局

下载chrome插件vue devtools

图标区域逻辑实现
推荐组件开发
周末游组件开发
Ajax获取首页数据

使用axios完成ajax请求 npm install axios --save

首页父子组件数据传递

第8章 项目实战 - 旅游网站城市列表页面开发

npm install better-scroll --save

第9章 项目实战 - 旅游网站详情页面开发

第10章 实战项目 - 项目的联调,测试与发布上线

npm install babel-polyfill --save

打包上线

npm run build