周日下午,我完成了Vue阶段考核,从八月中旬学习Vue开始,到现在也有两个月了。
从最开始看菜鸟教程的Vue2教程,看到CLI后开始寻求视频讲解,跟着视频慢慢学习,中间断了三周时间,回来之后发现Vue的知识基本上快忘完了,所以挑了重点的知识复习了一下,又听了别人的考核内容,对Vue知识有了一个明确的复习方向。然后跟着敲Vue案例,最后完成了Vue作品。国庆期间学习了其他内容,周日粗略复习Vue后完成了考核。考核过程中发现很多问题,基础知识掌握有欠缺,有些名词没有听过,解释的也不太清楚。以下是对考核中知识点的总结:
路由两种工作模式:
hash模式:指的url尾巴后的#号以及后面的字符。这里的#和css里的#是一个意思。hash也称作锚点,本身是来做页面定位的,可以是对应的id显示在可视区域内。#及以后的内容就是hash值,hash值不会带给服务器。
缺点:hash本身是用来做页面定位的,如果拿来做路由的话,原来的锚点功能就不能用了,其次,hash传参是基于url的,如果要传递复杂的数据,会有体积限制。
history模式:路径上没有#,地址干净,美观。兼容性比hash模式略差
路由器默认hash模式,如果使用history模式,需要在路由器中添加一个配置项 mode:'history'
路由守卫(对路由进行权限控制):
全局守卫
router.beforeEach()
router.afterEach()
独享守卫(某一个路由所独有的守卫)
beforeRouteEnter()
beforeRouteLeave()
组件内守卫(写一些组件里独有的逻辑)
beforeEnter:()
组件化和模块化:
组件化:组件化就是把可复用的、独立的、基础的、功能专一的代码封装到一个方法或者代码片段里,在未来需要的地方引入,用极少的代码实现之前相同的功能,避免相同功能代码的复写,提高开发效率。组件化属于纵向分块,每个组件就像一个竖直的线永不相交。
模块化:模块化是为了单独实现某一功能模块进行封装的方法,一个模块里可能拥有n个基础组件搭配产生。模块化属于横向分块,每个模块像一条横线把n条竖直的线串联起来形成一个整体。
组件相当于库,模块相当于框架。
脚手架概念:
vue-cli专门为单页面应用快速搭建繁杂的脚手架。是用于自动生成vue.js + webpack 的项目框架。
vuex五大属性:
1、state: vuex的基本数据,用来存储变量;
2、getters: 从基本数据(state)派生的数据,相当于state的计算属性;
3、mutations: 提交更新数据的方法,必须是同步的(如果需要异步使用action)。每个mutation 都有一个字符串的事件类型(type)和一个回调函数(handler)。
回调函数就是我们实际进行状态更改的地方,并且它会接受 state作为第一个参数,提交载荷作为第二个参数。
4、action: 和mutation的功能大致相同,不同之处在于 ①Action提交的是mutation,而不是直接变更状态,②Action可以包含任意异步操作。
5、modules: 模块化vuex,可以让每一个模块拥有自己的 state、mutation、action、 getters,使得结构非常清晰,方便管理。
$router和$route的区别:
$router是全局路由的实例对象,是router构造方法的实例。
$route表示当前的路由对象,里包含了当前URL解析的信息。
routes指创建vue-router路由实例的配置项,用来配置多个route路由对象