介绍ref

在setup函数中使用ref函数，可以变成我们想要的响应式数据，数据发生变化时，vue就会更新视图 例如：

<script setup lang="ts">
import { ref } from "vue";
const List = ref({ name: '小石'});
</script>

我们在script里面定义的语法糖，所以不需要在return，ref其实就是一个定义的类，通过点击修改打印出的值可以看见是通过改变.value的值发生响应式的数据改变

介绍isRef

isRef就是判断一个东西是不是ref对象，返回一个布尔值

<script setup lang="ts">
import { ref, isRef} from "vue";

const List = ref({ name: '小石'});

const change = (() => {
  console.log(isRef(List)); //true
  
})
</script>

介绍shallowRef

shallowRef是做浅层次响应式的，而ref是深层次的响应式，两者是有区别的，shallowRef包裹数据点击修改，视图是不会发生变化，但是这个属性值确发生变化，所以是浅层次，改变.value的值才会发生变化，他只到这个.value，在去里面一个个定义修改的值，shallowRef和Ref不能一起使用

介绍triggerRef

首先我们知道shallowRef和Ref不能一起使用，shallowRef会被受到影响，因为ref底层更新的时候会触发triggerRef，这个triggerRef会强制更新我们这个收集的依赖

介绍 customRef

这个是让我们自定义ref函数，这是一个回调函数，要求return一个对象要有get，set的两个方法，在回调中有两个参数，一个是用来收集依赖的，一个是触发依赖

function Myname<T>(value: T) {
  return customRef((a, b) => {
    return {
      get() {
        //收集依赖
        a()
        return value
      },
      set(newValue) {
        //触发依赖 更新值
        value = newValue
        b()
      }
    }
  })
}