Vue3 – 响应式数据的判断

简介

对于当数据特别多或数据比较陌生的时候，你不确定它是否为某些响应式数据的时候，可以通过Vue3提供的4个方法来判断该数据类型是否为响应式。

isRef

判断数据是否为 ref 响应式数据

let sum = ref(0);
console.log(isRef(sum));   // true

isReactive

判断数据是否为 reactive 响应式数据

let person = reactive({
      name:"张三",
      age:18
    });
console.log(isReactive(person));  // true

isReadonly

判断数据是否为 readonly 响应式数据

let person = reactive({
      name:"张三",
      age:18
    });
    person = readonly(person);
    console.log(isReadonly(person));  // true

isProxy

判断数据是否为 reactive 或 readonly 响应式数据

let person = reactive({
      name:"张三",
      age:18
    });
    person = readonly(person);
    let goods = reactive({
      goodsId:10,
      goodsName:"小米"
    });
    let sum = ref(100);
    
    console.log(isProxy(person));  // true
    console.log(isProxy(goods));  // true
    console.log(isProxy(sum));  // false