vue基本知识问题(1)（一天一个问题24）

1.v-if和v-show区别

v-if是渲染销毁DOM
v-show一次渲染，然后进行css的显示与影藏

2.watch（有哪些参数）和computed区别

computed有缓存；不接受参数；不能与data中的属性重复；return返回值
watch监听触发一个回调，接受两个参数；监听的属性必须存在；允许异步；watch配置：handler(需要执行的方法)、deep（是否深度）、immeditate（是否立即执行）

3.$route 和 $router区别

$route是当前路由对象，可以用来回去当前路由相关信息
$route.path, $route.params, $route.name, $route.query
全局的路由实例，是router构造方法的实例

4.vue有哪些指令

v-if v-show v-for v-bind v-on v-model v-once

5.vue组件里面data为什么写成函数

单纯的写成对象形式，就使得所有组件实例共用了一份data
如果data是一个函数的话，返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，不会互相影响

6.keep-alive作用以及如何使用

缓存不活动的组件,避免重新渲染
include：匹配的 路由/组件 会被缓存
exclude：匹配的 路由/组件 不会被缓存

<div id="app">
    // 1. 将缓存 name 为 test 的组件
    <keep-alive include='test'>
      <router-view/>
    </keep-alive>
    
    // 2. 将缓存 name 为 a 或者 b 的组件，结合动态组件使用
    <keep-alive include='a,b'>
      <router-view/>
    </keep-alive>
    
    // 3. 使用正则表达式，需使用 v-bind
    <keep-alive :include='/a|b/'>
      <router-view/>
    </keep-alive>   
    
    // 5.动态判断
    <keep-alive :include='includedComponents'>
      <router-view/>
    </keep-alive>
    
    // 5. 将不缓存 name 为 test 的组件
    <keep-alive exclude='test'>
      <router-view/>
    </keep-alive>
  </div>