vue 总结

1.计算属性（computed）和侦听属性（watch）的区别

computed官方文档：计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值

这就意味着只要 message 还没有发生改变，多次访问 reversedMessage 计算属性会立即返回之前的计算结果，而不必再次执行函数。

watch官方文档：当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。

watch监测的是属性值， 只要属性值发生变化，其都会触发执行回调函数来执行一系列操作

2.watch的深度监听

radio1:{ //监听的元素
      handler(newVal,oldVal){
        // 需要执行的操作
    },
    immediate: true, 
    deep: true,
  },
//监听销毁函数
unWatch(){
       app.$watch('radio1',(newVal,oldVal)=>{
         console.log(`${newVal}:${oldVal}`);
       })
    }

3.过滤器(filter)

过滤器就是数据经过处理之后转换为你想要的数据格式。比如给数据添加装饰，转换为相对应的文字显示等等

3.v-show和v-if的区别

v-show 只是简单的控制元素的 display 属性，有更高的首次渲染开销；v-show 切换开销小；适用于频繁切换的元素。

v-if 是条件渲染，是惰性的。条件为真，元素将会被渲染，条件为假，元素会被销毁；首次渲染开销要小的多；更高的切换开销；可以搭配 template 使用。

4.类的动态加载

//数组语法：
    :class="[
      fontTheme,
      darkMode ? 'dark-theme' : 'light-theme',
    ]"
//对象语法：
   :class="{
      'dark-theme': darkMode,
      'light-theme': !darkMode,
    ]
 //计算属性：
computed: {
    class() {
      return darkMode ? 'dark-theme' : 'light-theme';
    }
  }
:class="class"
//三目运算符：
 :class="darkMode ? 'dark-theme' : 'light-theme'"

5.static和assert在编译时的区别

static中的文件不会经过编译，打包后生成dist文件夹。static文件只是复制了一遍，
static中建议放一些外部的第三方文件，assets文件经过webpack打包，重新编译。

6.& 

伪选择器与混合一起使用，&标识当前选择器的父类