<template>
  <div id="demo5">
    <h3>姓名：{{obj.name}}</h3>
    <h3>年龄：{{obj.age}}</h3>
    <h3>
        玩具：
        <p>{{obj1.bb}}</p>
        <p>{{ obj1.cc}}</p>
    </h3>
    <button @click="change">修改玩具</button>
  </div>
</template>
<script setup lang="ts" name="Demo5">
  import { ref,reactive } from 'vue';
  let aa = ref('哈哈');
  let obj1 = reactive({
    bb:"1",
    cc:"2"
  })
  let sum = ref(0);
  let obj = reactive({
    name: "图图",
    age: 3,
    car: {
      c1: "玛莎拉蒂",
      c2: "大G",
    }
  })
  // function change() {
  //   obj1.value = {bb:"爱玛",cc:"上海永久"}
  // }
  function change() {
    
    // obj.car = {c1:"爱玛",c2:"上海永久"}
    console.log(obj1)
    // Object.assign(obj1,{bb:"爱玛",cc:"上海永久"})
    obj1 = {bb:"爱玛",cc:"上海永久"}
  // obj1= {}
  }
</script>

<style>

</style>