<script setup>
  import { ref } from 'vue';

  const deepObj = ref({
    level1: {
      level2: {
        level3: {
          level4: {
            level5: {
              level6: {
                level7: {
                  level8: {
                    level9: 'Hello Ray！',
                  }
                }
              }
            }
          }
        }
      }
    }
  });

  const updateDeepObj = () => {
    deepObj.value.level1.level2.level3.level4.level5.level6.level7.level8.level9 = 'Hello Vue 3！';
  }
</script>

<template>
<div>
  <p>deepObj：{{ deepObj.level1.level2.level3.level4.level5.level6.level7.level8.level9 }}</p>
  <button @click="updateDeepObj">Update deepObj</button>
  </div>
</template>