css 这个错误是什么“Uncaught TypeError:Cannot read property 'style' of undefined”?

l3zydbqr  于 2023-11-19  发布在  其他
关注(0)|答案(2)|浏览(168)

我试图运行以下代码,但我一直得到错误.我也尝试添加document. addEventList('DOMContentLoaded',(event)=>,但它仍然不工作.它不会给我给予错误,如果我把代码在控制台.它也不会给我给予错误,当我第一次加载它.但只要我刷新它开始给我错误.

import './Slider.css';
import Acc from './Accomodation/Acc'
import Flora from './Flora/Flora'
import Food from './OurFood/Food.js'
import Trek from './Treks/Treks';
import View from './OurView/View';
import Indoor from './IndoorGames/games';
let slideIndex = 0;
SlideShow()

function SlideShow(){
    
  let slides = document.getElementsByClassName("slide")
  console.log(slides)
  for (let i = 0; i < slides.length; i++) {
      slides[i].style.display = "none"; 
  }
  slideIndex++;
  console.log(slideIndex)
  console.log(slides)
  if (slideIndex === 0) {slideIndex = 1}
  else if (slideIndex === slides.length) {slideIndex = 1} 
  else if (slideIndex > slides.length) {slideIndex = 1} 
  console.log(slides[slideIndex])
  slides[slideIndex-1].style.display = "block"; 

  setTimeout(SlideShow, 10000);

}

function Slider() {

    return (
    <div className='Slider'>
        <h1>Experiences</h1>
        <hr />
        <div className='MySlides'>
        <div className='1 slide fade'>
        <Acc></Acc>
        </div>
        <div className='2 slide fade'>
        <Flora></Flora>
        </div>
        <div className='3 slide fade'>
        <Food></Food>
        </div>
        <div className='4 slide fade'>
        <Trek></Trek>
        </div>
        <div className='5 slide fade'>
        <View></View>
        </div>
        <div className='6 slide fade'>
        <Indoor></Indoor>
        </div>
        </div>
        
        </div>
    
    )  

    
}

export default Slider;

字符串

d7v8vwbk

d7v8vwbk1#

错误消息:

Uncaught TypeError: Cannot read property 'style' of undefined

字符串
根据错误信息,您的代码试图调用style属性;但是特定对象没有style属性。我说的 * 特定对象 * 是什么意思?示例:

const someObject = { // the object
 style: 'some value' // the property
}


因此,我们需要查看代码中style的引用,并在代码中定位特定的父对象:

  1. slides[i].style.display = "none";->父对象是slides[i]
  2. slides[slideIndex-1].style.display = "block";->父对象是slides[slideIndex-1]
    因此,slides[i]slides[slideIndex-1]对象没有style属性。
eqfvzcg8

eqfvzcg82#

您可以使用

try {} 
catch (error) {console.log(error)}

字符串
它将记录错误
主要问题是slides[slideIndex-1]没有值,因此无法读取styles属性

相关问题