我要從全局獲取一個ImagesConfig.image01.url的圖片地址，然后圖片地址賦值給image01，然后再把image01賦值給imgUrl，但是圖片無法加載，請問怎么解決？

render() {
        var divStyle = {
            position: 'absolute',
            top: 0,
            left: 0,
            width:1920,
            height: 1080
        }
        console.log(ImagesConfig.image01.url)
        //var image01 = ImagesConfig.image01.url;
        var image01 = '../../../../public/imagesConfig/images/slide1.jpg';
        var imgUrl = require(image01);
        //var imgUrl = require(image01);

        return (

            <div className={"slider"} style={divStyle}>


                <ul className={"slider-main"}>
                    <li className={"slider-panel"}>
                        <img src={imgUrl}></img>
                    </li>
                    <li className={"slider-panel"}>
                        <img src={require('../../../../public/imagesConfig/images/slide2.jpg')}></img>
                    </li>
                    <li className={"slider-panel"}>
                        <img src={require('../../../../public/imagesConfig/images/slide3.jpg')}></img>
                    </li>
                    <li className={"slider-panel"}>
                        <img src={require('../../../../public/imagesConfig/images/slide4.jpg')}></img>
                    </li>
                    <li className={"slider-panel"}>
                        <img src={require('../../../../public/imagesConfig/images/slide4.jpg')}></img>
                    </li>
                    <li className={"slider-panel"}>
                        <img src={require('../../../../public/imagesConfig/images/slide4.jpg')}></img>
                    </li>
                </ul>
                <div className={'slider-extra'}>
                    <ul className={'slider-nav'}>
                        <li key="0" className={'slider-item'}>1</li>
                        <li key="1" className={'slider-item'}>2</li>
                        <li key="2" className={'slider-item'}>3</li>
                        <li key="3" className={'slider-item'}>4</li>
                        <li key="4" className={'slider-item'}>5</li>
                        <li key="5" className={'slider-item'}>6</li>
                    </ul>
                    <div >
                        <a  href="javascript:;;"></a>
                        <a href="javascript:;;"></a>
                    </div>
                </div>
            </div>
            )
    }