<template>
  <div>
    <h1>App</h1>
    <hr>
    <hr>
    <Demo20></Demo20>
    <!-- <Demo17 ref="dom1"></Demo17> -->
    <!-- <button @click="changeMain">获取</button> -->
    <!-- <Demo16 v-if="isShow"></Demo16> -->
    <!-- <hr>
    <hr>
    <Demo8></Demo8>
    <hr>
    <hr>
    <Demo7></Demo7>
    <hr>
    <hr>
    <Demo6></Demo6>
    <hr>
    <hr>
    <Demo5></Demo5>
    <hr>
    <hr>
    <Demo1></Demo1>
    <hr>
    <hr>
    <Demo2></Demo2>
    <hr>
    <hr>
    <Demo3></Demo3>
    <hr>
    <hr>
    <Demo4></Demo4> -->
  </div>
</template>

<script setup>
// import Demo1 from './components/Demo1.vue'
// import Demo2 from './components/Demo2.vue'
// import Demo3 from './components/Demo3.vue'
// import Demo4 from './components/Demo4.vue'
// import Demo5 from './components/Demo5.vue'
// import Demo6 from './components/Demo6.vue'
// import Demo7 from './components/Demo7.vue'
// import Demo8 from './components/Demo8.vue'
// import Demo9 from './components/Demo9.vue'
// import Demo16 from './components/Demo16.vue';
// import Demo17 from './components/Demo17.vue';
import Demo20 from './components/Demo20.vue';
import { ref } from 'vue';
let isShow = ref(true);
let dom1 = ref();
const changeMain = () => {
  console.log(dom1.value)
}
</script>

<style lang="scss" scoped>
</style>
