10-20 钟申义 日志

10-20 钟申义 日志

vue-router怎么定义动态路由?写出怎么获取传过来的动态参数?

在 router 目录下的 index.js 文件中,对 path 属性加上/:id
使用 router 对象的 params.id

vue-router 有哪几种导航钩子?

全局导航钩子:router.beforeEach(to,from,next)
组件内的钩子
单独路由独享组件

详尽介绍vue的各个生命周期?

beforeCreate( 创建前 ): 在 beforeCreate 阶段,vue 实例的挂载元素 el 和数据对象 data 都为 undefined,还未初始化。
created ( 创建后 ):在 created 阶段,vue 实例的数据对象 data 有了,el 还没有
beforeMount:在 beforeMount 阶段,vue 实例的$el 和 data 都初始化了,但还是挂载之前为虚拟的 dom 节点,data.message 还未替换。
mounted:mounted 阶段,vue 实例挂载完成,data.message 成功渲染
beforeUpdate/updated:更新前/后:当 data 变化时,会触发 beforeUpdate 和 updated 方法
beforeDestroy:在实例销毁之前调用,实例仍然完全可用,

​ 这一步还可以用this来获取实例,
​ 一般在这一步做一些重置的操作,比如清除掉组件中的定时器 和 监听的dom事件

destroyed:在实例销毁之后调用,调用后,所以的事件监听器会被移出,所有的子实例也会被销毁,该钩子在服务器端渲染期间不被调用

​ (在执行 destroy 方法后,对 data 的改变不会再触发周期函数,说明此时 vue 实例已经解除了事件监听以及和 dom 的绑定,但是dom 结构依然存在)

DOM 渲染在哪个周期中就已经完成?

mounted

什么是 vue 生命周期?

Vue 实例从创建到销毁的过程,就是生命周期。也就是从开始创建、初始化数据、编译模板、挂载 Dom→渲染、更新→渲染、卸载等一系列过程,我们称这是 Vue 的生命周期

简单描述每个周期具体适合哪些场景?

beforecreate : 可以在这加个 loading 事件,在加载实例时触发
created : 初始化完成时的事件写在这里,如在这结束 loading 事件,异步请求也适宜在这里调用
mounted : 挂载元素,获取到 DOM 节点
updated : 如果对数据统一处理,在这里写上相应函数
beforeDestroy : 可以做一个确认停止事件的确认框

$route 和 router 的区别?

$route : 包括 path,params,hash,query,fullPath,matched,name 等路由信息参数
$router: 是路由的跳转方法,钩子函数等

心得

今天的东西不仅绕,而且快!

标签

评论

this is is footer