1.怎么定义Vue-router的动态路由?怎么获取传过来的动态参数?
设置:在router目录下的index.js文件中,对path属性加上/:id
获取:使用router对象的params.id 例如 : this.$route.params.id
2.Vue引用虚拟DOM解决什么问题?
虚拟DOM就是为了解决浏览器性能问题而被设计出来的。用JS对象模拟DOM节点的好处是,页面的更新可以先全部反映在JS对象(虚拟DOM)上,操作内存中的JS对象的速度显然要更快,等更新完成后,再将最终的JS对象映射成真实的DOM,交由浏览器去绘制。
3.Vue-router有哪几种导航钩子
第一种:是全局导航钩子:
router.beforeEach(to,from,next)
第二种: 组件内的钩子
beforeRouteEnter(to, from, next) {
在渲染该组件的对应路由被 confirm 前调用
},
beforeRouteUpdate(to, from, next) {
在当前路由改变,但是依然渲染该组件是调用
},
beforeRouteLeave(to, from ,next) {
导航离开该组件的对应路由时被调用
}
第三种:单独路由独享钩子
beforeEnter(to, from, next)
4.用CSS实现元素的垂直居中,都有哪些实现方法?
1、头部和顶部使用相同大小的padding值可以实现居中
2、单行文本可以用line-height实现垂直居中,设置子元素的line-height值等于父元素的height,这种方法适用于子元素为单行文本的情况。
3、通过display:flex,align-items: center;或 align-self: center;实现垂直居中
4、使用position、transform实现元素垂直居中
5、使用position结合margin:auto实现垂直居中
6、使用 display :table和 vertical-align 对容器里的文字进行垂直居中, 父元素使用display:table,子元素使用display:table-cell属性来模拟表格,子元素设vertical-align:middle即可垂直居中
7、通过verticle-align:middle实现行内垂直居中
5.介绍一下组件中父子间通信
1.概念:A组件中调用B组件,那么A组件就是父组件,B组件就是子组件
通信方式:
2.父组件向子组件传递数据——使用props
3.子组件向父组件传递数据——使用this.$emit暴露