Vue篇
11.Vue中路由跳转方式(声明式/编程式)
Vue中路由跳转有两种,分别是声明式和编程式
用js方式进行跳转的叫编程式导航this.$router.push()
用router-link进行跳转的叫声明式router-view路由出口,路由模板
显示的位置
路由中name属性有什么作用?
在router-link中使用name导航到对应路由
使用name导航的同时,给子路由传递参数
12.vue跨域的解决方式
1.后台更改header
2.使用jq提供jsonp
3.用http-proxy-middleware(配置代理服务器的中间件)
13.Vue的生命周期请简述
vue的生命周期就是vue实例创建到实例销毁的过程。期间会有8个钩
子函数的调用。
beforeCreate(创建实例)
created(创建完成)、
beforeMount(开始创建模板)
mounted(创建完成)、
beforeUpdate(开始更新)
updated(更新完成)、
beforeDestroy(开始销毁)
destroyed(销毁完成)
14.Vue生命周期的作用
其作用是在vue生命周期的不同阶段通过对应的钩子函数来实现组件数据管理和DOM渲染两大重要功能。
15.DOM渲染在那个生命周期阶段内完成
DOM渲染在mounted周期中就已经完成
16.Vue路由的实现
前端路由就是更新视图但不请求页面,
利用锚点完成切换,页面不会刷新
官网推荐用vue-router.js来引入路由模块
定义路由组件
定义路由,使用component进行路由映射组件,用name导航到对应
路由
创建router实例,传入routes配置
创建和挂载根实例
用router-link设置路由跳转
17.Vue路由模式hash和history,简单讲一下
Hash模式地址栏中有#,history没有,history模式下刷新,会出现404情况,需要后台配置
使用JavaScript来对loaction.hash进行赋值,改变URL的hash值可以使用hashchange事件来监听hash值的变化
HTML5提供了HistoryAPI来实现URL的变化。其中最主要的API
有以下两个:history.pushState()和history.repalceState()。这两个API可以在不进行刷新的情况下,操作浏览器的历史纪录。唯一不同的是,前者是新增一个历史记录,后者是直接替换当前的历史记录。
18.Vue路由传参的两种方式,params和query方式与区别
动态路由也可以叫路由传参,就是根据不同的选择在同一个组件渲染不
同的内容
用法上:query用path引入,params用name引入,接收参数都是类似的,分别是this.$route.query.name和this.$route.params.name
url展示上:params类似于post,query类似于get,也就是安全问题,
params传值相对更安全点,query通过url传参,刷新页面还在,params刷新页面不在了
19.Vue数据绑定的几种方式
1.单向绑定双大括号{{}}html内字符串绑定
2.v-bind绑定html属性绑定
3.双向绑定v-model
4.一次性绑定v-once依赖于v-model
20.Vue注册一个全局组件
Vue.componnet(“组件的名字”{对象template<div>组建的内容</div>})