demo4.vue 551 B

12345678910111213141516171819202122232425
  1. <template>
  2. <m-button @click="outDrawer = true">点击打开</m-button>
  3. <m-drawer
  4. title="我是外面的 Drawer"
  5. v-model="outDrawer"
  6. width="50%">
  7. <div>
  8. <m-button @click="innerDrawer = true">打开里面的!</m-button>
  9. <m-drawer
  10. title="我是里面的 Drawer"
  11. :append-to-body="true"
  12. v-model="innerDrawer">
  13. <p>快到碗里来!</p>
  14. </m-drawer>
  15. </div>
  16. </m-drawer>
  17. </template>
  18. <script setup>
  19. import { ref } from "vue";
  20. const outDrawer = ref(false);
  21. const innerDrawer = ref(false);
  22. </script>