Javascript 无法在vue.js的挂载挂钩上记录DOM元素

出于某种原因，在挂载的钩子上，我似乎无法在浏览器上记录DOM元素，而我可能会在元素之间循环，或者，作为我最后的手段，我只能处理HTML集合的特定索引：

以下是我遇到问题的vue组件：

<template>
  <full-page ref="fullpage" id="fullpage" :options="options">
            <slider class="section" :auto="false">
                <slider-item v-animate-css="'fadeIn'">
                    <h1 class="mainTitle">PROJECT GORILLA</h1>
                </slider-item>
                <slider-item v-for="bkg in bkgImg" :style="{backgroundSize:'cover', 
                backgroundImage: 'url(' + bkg + ')'}">
                <h1 class="mainTitle">PROJECT GORILLA</h1>
                </slider-item>
        </slider>
  </full-page>
</template>
<script>
import { Slider, SliderItem } from 'vue-easy-slider'
import pinkBkg from '@/assets/img/IMG_2473.jpg'
import redBkg from '@/assets/img/IMG_4674.jpg'
import blueBkg from '@/assets/img/IMG_4716.jpg'
import greenBkg from '@/assets/img/IMG_2013.jpg'

export default {
    data(){
      return {
        options:{
          licenseKey:null
        },
        bkgImg:[pinkBkg,redBkg,blueBkg,greenBkg]
      }
    },
    components: {
        Slider,
        SliderItem
    },
    mounted(){
        let slides = document.getElementsByClassName("slider-item");

        console.log(slides[0]);


    }
}
</script>
<style>

.slider-item:nth-of-type(1) { background-color:black;}

.slider-item > .wrap {
    display:flex;
    justify-content: center;
    align-items:center;
}
h1.mainTitle {
    position:fixed;
    z-index:99;
    color:white !important;
}
.slider-item {
    z-index:98 !important;
}

</style>

请记住，我目前正在使用vue cli的webpack模板。老实说，jQuery在我的脑海中已经出现了，作为最后的手段，但我真的不想这么做 求助于此，因为应用程序具有良好的性能非常重要。。。

---

在这种情况下，console.log返回未定义的。但是，如果我在浏览器上复制并通过代码，那么它就可以正常工作。

当安装组件时，并不一定意味着其中的子组件已完全呈现

正如您在模板中看到的，没有class=slideritem的HTML元素。我想这些会在稍后渲染SliderItem组件时出现

您可以做的是向任何要引用的元素或组件添加ref属性

比如说

大猩猩计划 大猩猩计划 然后在你的挂载钩，你可以访问

此.$refs.sliderItem//第一个非重复组件 这个.$refs.sliderItemRepeater//一个重复组件的数组

---

请参见

这是一些有趣的信息，谢谢！我肯定会调查这个问题，如果我发现任何问题，我会回来的。似乎$ref到目前为止，我只能得到组件的引用，而不能得到实际的div元素，这很奇怪。。。我甚至尝试记录$el属性，希望能够获取元素。我的最终目标是能够访问H1.main标题，以便能够为其设置动画。我甚至试着给h1添加一个refreference，但它也不起作用。你可以将ref属性放在上，然后直接访问它。你应该在问题中解释你到底想做什么