vue-ref和reactive

ref和reactive都可以实现响应式刷新数据，这两个修改对象、数组都可以，方式有所不同，

ref修改对象的值的话需要：对象.value.属性名。

reactive修改对象：对象.属性名

<script setup>
import {ref,reactive} from "vue";
const refData=ref({name:"mr.wu",age:30});
const reactiveData=reactive({name:"米斯特务",age:28});
const updateRefData=()=>{
    refData.value.name="mister.wu";
}
const updateReactiveData=()=>{
    reactiveData.name="mister.wu";
}
</script>

<template>
<div class="home">
<p>RefData:{{refData.name}} - {{refData.age}}</p>
<button @click="updateRefData">更新RefData</button>
<p>reactiveData:{{reactiveData.name}} - {{reactiveData.age}}</p>
<button @click="updateReactiveData">更新ReactiveData</button>

</div>

</template>

<style scoped>

</style>