Vue3-02-ref() 响应式详解

ref() 是什么

ref() 是一个函数；
ref() 函数用来声明响应式的状态（就是来声明变量的）
ref() 函数声明的变量，是响应式的，变量的值改变之后，页面中会自动重新渲染。

ref() 有什么特点

1.ref() 可以声明基础类型的变量，也可以声明复杂类型的变量；
   如 基本的 number 类型、string类型，以及 json对象类型都可以进行声明；

2.ref() 声明的变量，是深度响应式的；
   比如一个变量是json类型的，会有多层的嵌套，那么深层嵌套的属性值发生改变时，该变量同样是响应式的；

3.ref() 声明的变量 在 script 脚本中使用时，需要添加一个 [.value] 属性才能取到对应的值；
  如 ： 声明变量： const a = ref(100);
       使用变量： console.log(a.value); // 添加 .value 才可以真正访问到变量的值；

4.ref() 声明的变量  在template 模板中，可以直接使用，无需使