Vue3中响应式数据的判断

Vue3中，常用的响应式数据判断方法有以下几个：

* isRef，是否是由ref定义的响应式数据
* isReactive，是否是由reactive定义的响应式数据
* isReadonly，是否是由readonly定义的数据
* isProxy，是否是由reactive或readonly定义的数据
看个简单的例子吧。

* main.js import { createApp } from 'vue' import App from './App.vue'
createApp(App).mount('#app')
* App.vue <template> <h2>当前和值为{{sum}}</h2> <h2>这台{{brand}}的售价是{{price}}</h2>
</template> <script> import { ref,reactive,readonly,toRefs, isRef,isReactive,
isReadonly, isProxy} from 'vue'; export default { name:"App", setup(){ let sum =
ref(0); let car = reactive({ brand:"BYD", price:"30W" }) let car2 = readonly(car
); console.log("isRef(sum)=",isRef(sum)); console.log("isReactive(car)=",
isReactive(car)); console.log("isReadonly(car2)=",isReadonly(car2)); console.log
("isProxy(car)=",isProxy(car)); console.log("isProxy(car2)=",isProxy(car2));
console.log("isRef(car)=",isRef(car)); return { sum, ...toRefs(car) } } } </
script>
* 启动应用，测试效果

• « 上一篇：idea中新建和写一个简单的vue项目
• » 下一篇：mybatis-plus 主键自增问题