1、ref和reactive
原来reactive是一个对象类型,使用reactive重新赋值一个对象不起作用
<script lang="ts" setup>
import {reactive} from "vue";
let user = reactive({name: '小明', age: 10});
const dj = () => {
user = {name: '大白', age: 100}// 这样是不起作用的
}
</script>
<template>
<div>
<h1>{{ user }}</h1>
<h1>
<button @click="dj()">点击</button>
</h1>
</div>
</template>
需要改成Object.assign(user,{name: '大白', age: 100});才行
对于ref这样赋值可以
<script lang="ts" setup>
import {reactive, ref} from "vue";
let user = ref({name: '小明', age: 10});
const dj = () => {
user.value = {name: '大白', age: 100}
}
</script>
<template>
<div>
<h1>{{ user }}</h1>
<h1>
<button @click="dj()">点击</button>
</h1>
</div>
</template>