vue的基础知识2:数组,对象,创建过滤方法,自定义指令等
欢迎加入我的51CTO官方专属交流群:697483006
有关学习上的任何问题都可以在群中向老师提出来,我会及时给予解答的。
本课程已经更新到了“Web前端全栈开发零基础到全栈开发 -前端技术持续更新”课程中,大家可以持续学习到web前端前沿的技术
本课程的内容涉及到两方面的学习:
1.vue框架的整体介绍以及通过归档的方法下载vue.js文件和项目引入
2.学习vue的基础知识:数据结构+各种指令的学习+事件的触发
3.计算属性的讲解及事件绑定,表单输入绑定以及过滤器,自定义指令
4.通过案例来巩固前面的知识:开发备忘录的案例+商品列表案例
5.vue组件的系统学习
6.在node.js环境中通过vue脚手架来搭建项目以及学习webpack
7.讲解路由的知识点:编程式,嵌套路由,动态路由,程序化导航等
8.通过商品列表的案例来学习vue相关的知识点
9.继续通过商品列表的案例来学习vue相关的知识点
10.静态资源的导入:css文件,js文件,img图片
11.axios插件的应用:实现前后端数据的通信
12.学习vuex状态管理插件
13.讲解vuex的高级操作:以模块的形式来封装vuex
14.在项目中导入第三方的插件以及如何应用
15.梳理针对vue开发的综合项目百草味的案例需求
把登录成功的用户信息记录到缓存中通过缓存来判断用户是否登录过
用户登录成功之后把选中的商品加入到购物车中vuex进行数据处理
在vuex仓库中对加入的商品的几种情况分别进行处理
在vuex仓库中对商品数据处理完之后再更新到缓存中
更新加入购物车数据的方法以及把购物车数量渲染在徽章中
项目刚运行的时候在初始化函数中判断用户的登录状态
项目刚运行的时候在初始化函数中从缓存中更新购物车的数据到仓库
通过计算属性来开发计算总价格的功能
在购物车组件中控制每一个商品的复选框
在购物车组件中全选复选框和每一个商品复选框关联
下载并且安装三级联动v-distpicker插件
加入编辑地址功能处理视图层和数据层
公开笔记对他人可见,有机会被管理员评为“优质笔记”
{{ noteEditor.content.length }}/2000
讲师收到你的提问会尽快为你解答。若选择公开提问,可以获得更多学员的帮助。
课程大纲
- 第一章 vue的知识点的讲解
- 1-1试看 vue的基础知识1:安装,模版语法,条件语句,循环语句02:37:35
- 1-2试看 vue的基础知识2:数组,对象,创建过滤方法,自定义指令等01:55:03
- 1-3vue基础案例02:10:43
- 1-4vue的基础知识3:组件的学习02:41:05
- 1-5vue的基础知识5:针对vue组件的案例讲解02:04:08
- 1-6vue的基础知识6:通过脚手架vue-cli来搭建vue项目02:11:29
- 1-7vue的基础知识7:路由的讲解02:12:48
- 1-8vue的基础知识8:路由,样式,案例讲解02:23:18
- 1-9vue的基础知识9:使用导航守卫,导入静态资源02:17:26
- 1-10vue的基础知识10:vuex的插件的使用03:36:13
![Web前端开发经典案例之vue框架开发电商项目百草味案例(一)](https://s2.51cto.com/images/202011/17/8bffe6e01fba2088dcedcd49bc09af35.png?x-oss-process=image)
![web前端开发之Vue框架基础知识的讲解/vue.js/router/axios/vuex](https://s2.51cto.com/images/202011/17/7c5c72cfe3b92abc1500d9a2041c0f7b.png?x-oss-process=image)
![Web前端开发经典案例之vue框架开发电商项目百草味案例(二)](https://s2.51cto.com/images/202011/17/5eef344974ebe85a2806508ba2effa5b.png?x-oss-process=image)
![前端框架vue的学习](https://s2.51cto.com/images/202004/26/b3926ecac62ec9075af1ac24c1453b8f.png?x-oss-process=image)
![Vue.js 2.0之全家桶系列视频课程(vue、vue-router、axios、vuex)](https://s2.51cto.com/images/202002/25/82ac2aecd85f4c101423e871cc3feaac.jpg?x-oss-process=image)
![【云原生开发】Vue3、Vite、Pinia、Axios、HTML、JS、CSS入门到项目实战](https://s2.51cto.com/images/202306/02/fe9c6b85266811f3b9a7d5c1502fb7c2.png?x-oss-process=image)
![Node.js进阶教程第五步:用VUE.JS学习ES6视频课程](https://s2.51cto.com/images/201612/6545d2501f864ec9ec4462f67e5d35c8b320ad.jpg?x-oss-process=image)
![Vue.js前端开发基础与项目实战](https://s2.51cto.com/images/202008/28/3b94d8e14990ba453d8131cd091f597e.jpg?x-oss-process=image)