← 返回首页
Vue3基础教程(三十三)
发表时间:2021-08-13 17:39:52
响应式数据的判断

常见的响应式数据的判断API。 - isRef: 检查一个值是否为一个 ref 对象 - isReactive: 检查一个对象是否是由 reactive 创建的响应式代理 - isReadonly: 检查一个对象是否是由 readonly 创建的只读代理 - isProxy: 检查一个对象是否是由 reactive 或者 readonly 方法创建的代理

实例:

<template>
    <h2>响应式数据的判断</h2>
    <hr>
</template>

<script lang="ts">
    import {
        defineComponent,
        ref,
        readonly,
        reactive,
        isRef,
        isProxy,
        isReactive,
        isReadonly,
        toRef
    } from 'vue'

    export default {
        name: 'App',
        setup () {
            console.log("是否是Ref:"+isRef(ref('hello')));
            console.log("是否是Ref:"+isRef({name:'admin'}));
            console.log("是否是Ref:"+isRef(toRef({name:'admin'},"name")))
            console.log("是否是Reactive:"+isReactive(ref('hello')));
            console.log("是否是Reactive:"+isReactive(reactive({name:'zhangsan'})));
            console.log("是否是Readonly:"+isReadonly(readonly(ref('vue'))));
            console.log("是否是Proxy:"+isProxy(reactive({name:'lisi'})));
            return {
            }
        }
    }

</script>