vue充电中

v-if 和 v-show区别

作用：都是控制元素隐藏和显示的指令

区别：

v-show: 通过display：none控制元素隐藏，只会编译一次；

v-if: 动态向dom树添加或删除dom元素，若初始值为false，不会编译，且不停的消耗和重建消耗性能。

应用： v-show: 适合使用在切换频繁显示/隐藏的元素上（切换开销小，初始开销大） ；v-if: 适合使用在切换不频繁，且元素内容很多，渲染一次性能消耗很大的元素上（切换开销大，初始开销小）

key的作用：

key给每一个节点做唯一标识，diff算法识别此节点。

作用：高效更新虚拟dom

watch和computed的区别以及使用案例

watch监听的范围

1.监听data中数据的变化 ,示例如下；

  var vm = new Vue({
    //......
    data: {
      name: "耿耿"
    },
    watch: {
      "name": function(newVal, oldVal) { 
       
      }
     *注释 : newVal:数据改变后的值, oldVal:数据改变之前的值*
    }
  })

2. 监听路由的改变；

var vm = new Vue({
    watch: {
      "$route.path": function() { }
    }
  })

 3.** 监听props中接受的数据的变化**

 props: {
    basicData: {
      type: Object,
      default: ()=>{}
    }
  },
   watch: {
      'basicData.id':{
        handler(newData,oldData){
            console.log(ne