Vue基础介绍,Vue2.0,Vue3.0

https://www.bilibili.com/video/BV1zq4y1p7ga?p=2&vd_source=af58e28c982277b2a4a63e033dca413c

 

1、前端工程化与webpack

前端工程化的相关概念

Webpack的常见用法

打包发布

Source Map

了解工程化的前端开发方法

能够知道Webpack在实际开发中所起到的作用

2、Vue的基本使用步骤

Vue中常用 的指令

vue-devtools调试工具

目标:

1、能够使用Vue的指令完成页面结构的渲染

2、能够使用Vue的调试工具辅助Vue的开发

3、Vue基础

过滤器和侦听器

计算属性的用法

axios的基本用法 

vue-cli的安装和使用

目标:

能够在实际开发中合理运用过滤器侦听器计算属性解决自己遇到的问题

能够使用axios发起Ajax请求

能够使用vue-cli工具生成工程化的vue项目

第四天:组件与生命周期

组件的注册和使用

组件的props自定义属性

解决组件样式冲突

组件的生命周期

组件之间的通讯(数据共享)

目标:

能够掌握.vue单文件组件是基本用法

能够掌握组件通讯的三种方式

掌握组件生命周期的执行顺序和应用场景

第五天

ref & 购物城案例

使用ref引用dom元素和组件实例

$nextTick的基本使用

第六天 Vue组件的高级用法

动态组件的使用

 插槽的使用

自定义指令

ESLint的使用

目标:

能够使用keep-alive实现组件的缓存

能够使用插槽提供组件的复用性

能够了解常见的ESLint语法规则

第七天

路由 vue-router

路由的基本配置与使用

路由重定向

嵌套路由,动态路由

编程时导航,路由导航守卫

 

目标:

能够在项目中安装和配置路由

能够使用路由实现单页面应用程序的开发

能够使用导航守卫控制路由的访问权限

第八天

Vant组件库

封装axios

上拉加载和下拉刷新

Vant主题定制

目标:掌握Vant组件库的基本使用。

能够知道如何封装axios请求模块。

能够知道如何实现上拉加载和下拉刷新功能。

 

前端工程化与Webpack

理解什么是前端工程化

了解webpack的基本用法

不强制要求大家能手动配置webpack

小白眼中的前端开发

实际的前端开发 重点

模块化(js的模块化、css的模块化、资源的模块化)

组件化(复用现有的UI结构、样式、行为)

规范化(目录结构的划分、编码规范化、接口规范化、文档规范化、Git分支管理)

自动化(自动化构建、自动部署、自动化测试)

 

把前端开发所需的工具,技术、流程、经验等进行规范化、标准化

企业中的Vue项目,都是基于工程化的方式进行开发的;

有一套标准的开发方案和流程;

前端工程化的解决方式

目前主流的前端工程化解决方案

 

webpack:代码压缩混淆、处理浏览器端javaScript的兼容性、性能优化;等强大的功能;

可以放心大胆的写JavaScript高级语法知识;运行的时候webpack自动转化;大胆放心的写高级语法;IE8的解决方案;

好处:让程序员把工作的重心放到具体功能的开发上;提高前端的开发效率;

 

posted on 2022-06-18 21:52  四海骄阳  阅读(38)  评论(0编辑  收藏  举报

导航