vue前端面试必备五道题

一、$nextTick方法的作用

     $nextTick 也叫作异步更新队列法  而$nextTick方法主要作用是等待DOM加载完成后执行的回调函数
     我们经常会在nextTick方法里面获取DOM元素

二、组件通信

1.父传子

     父传子：在子组件标签上定义属性 在子组件用props来接收传过来的数据 可以通过数组方式接收 
     也可以通过对象方式接收  如果父组件没有传递属性 子组件可以通过default来接收默认值

2.子传父

- 子传父： 在子组件标签上定义一个指令 子组件通过this.$emit("事件名",传的数据)来传递
          在父组件中接收这个方法 通过方法来接收传递过来的数据 

3.兄弟相传

- 兄弟相传：首先创建一个空的js文件 在这个文件里创建一个vue实例 然后导出 然后通过
  实例对象调用.on这个方法进行接收 最后通过emit方法发送  

三、v-for和v-if

• 他们的优先级？ 怎么解决？

    答：
      v-for优先级高 因为v-for的时候我们才开始渲染dom节点  这时v-if还无法判断
      v-for和v-if不建议同时使用 我们可以在外层套一个div或一个template标签 在这个标签上写v-if
  

四、v-if和v-show

• 他们的区别

  答：
    v-if和v-show都是控制元素的显示与隐藏  
    v-if控制显示与隐藏时会删除dom节点 然后重新创建dom和渲染
    v-show 是根据css的display：none 和display：block来控制的
    v-if比较消耗性能 如果涉及到频繁切换的时候 建议使用v-show
  

五、vue路由模式

• vue路由有几种模式？ 有什么区别？ 原理是什么？

    答：
        vue路由模式一共有两种   分别是hash模式和history模式   
        他们的区别分别是  hash模式不会包含在http请求中 并且hash模式不会重新加载页面
        而history模式前端的url和后端发起请求的url不一致的话 会抱404错误  所以使用history模式
        要和后端进行配合
  
    	  history模式原理就是利用html5新增的两个特性方法 分别是pushState和replaceState来完成的  
  
    	  以上就是我对vue路由模式的理解