在react中从javascript文件加载图像时出现问题

Question

我在React中使用"setInterval“时遇到了问题。如果我不使用"setInterval"，没有问题，但是当我使用它时，我的图像将不会出现在我的page.Please帮助中。

下面是我的组件，我在其中导入了包含图像的JS文件：

import React from 'react';
import ReactDOM from 'react-dom';
import logo from './lastricouri.jpg';
import img from './app.js';
import inter from './app.js';


class Logo extends React.Component {
    render() {
        return (
            <div id = 'header-container'>
                <img src ={logo} id='tricouri'></img>
                <img src={inter}></img>
                <div id='btns'>
                    <a href='#' id='logi'>Log In</a>
                    <a href='#' id='signup'>Sign Up</a>
                </div>
                <input type='text' id='txt' placeholder='Ai libertatea de a alege!'></input>
            </div>
        );
    }
}

export default Logo;

下面是我的组件，其中包含图像：

首先从‘./1.jpg’导入；

import second from './2.jpg';
import third from './3.jpg';
import fourth from './4.jpg';
import fifth from './5.jpg';

let inter = setInterval(() => {
    const tshirts = [first,second,third,fourth,fifth];
        const rndimg = Math.floor(Math.random() * 5);
    
        const img = tshirts[rndimg]; 
},3000);
        
export default inter;

Answer 1

SetInterval返回分配给inter变量的唯一间隔id。inter不包含您的图像源。如果您想要分配一个随机图像，请像这样更改代码

let inter;
setInterval(() => {
    const tshirts = [first,second,third,fourth,fifth];
    const rndimg = Math.floor(Math.random() * 5);
    inter = tshirts[rndimg]; 
},3000);

export default inter;