学习 vue3 shallowReactive 的碰到的问题

Question

我有如下的一段 vue3 代码

<template>
  <h2>m2:{{ m2 }}</h2>
  <button @click="update">update</button>
</template>

<script lang="ts">
import { defineComponent, shallowReactive } from "vue";
export default defineComponent({
  name: "",
  setup() {
    const m2 = shallowReactive({
      name: "mingren",
      age: 20,
      car: {
        name: "奔驰",
        color: "red",
      },
    });
    const update = () => {
      m2.name = "晓明";
      m2.car.name = "宝马";
      console.log("m2: ", m2);
    };
    return { m2, update };
  },
});
</script>

疑问:shallowReactive 不是浅响应吗 为什么我修改了 car的name 属性 界面也会发生改变?