<template>
  <!-- <child1 slot="skeleton" /> -->
  <div class="home">
    <vue-lazy-component>
      <Boutique class="home-item" />
    </vue-lazy-component>
    <vue-lazy-component>
      <Virtural class="home-item" />
    </vue-lazy-component>
    <vue-lazy-component>
      <CulturalRelic class="home-item" />
    </vue-lazy-component>
    <vue-lazy-component>
      <Display class="home-item" />
    </vue-lazy-component>

      <vue-lazy-component>
      <MuseumMap class="home-item" />
    </vue-lazy-component>
    <!-- <Footer /> -->
  </div>
</template>

<script>
import NavBar from "@/components/NavBar";
import Footer from "@/components/Footer";
import Boutique from "./components/Boutique.vue";
import MuseumMap from "./components/MuseumMap.vue";
import Virtural from "./components/Virtural.vue";
import Display from "./components/Display.vue";
import CulturalRelic from "./components/CulturalRelic.vue";
export default {
  components: {
    NavBar,
    Footer,
    MuseumMap,
    Boutique,
    Virtural,
    Display,
    CulturalRelic,
  },
  name: "Home",
  data() {
    return {};
  },
  methods: {
    handleClickVitual() {
      //暂时写死
      window.open(
        "https://720yun.com/t/6cvkbyf7z7w?scene_id=90524980#scene_id=90524980"
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.home {
  display: flex;
  flex-direction: column;
  .home-item {
    height: 100vh;
    width: 100%;
  }
}
</style>