没有报错但是图片没有显示到网页上

Question

//加载CSS
require('normalize.css/normalize.css');
require('styles/App.scss');
import React from 'react';

//获取图片相关数据
const imageDatas = require('json-loader!../data/imageDatas.json');

//利用自执行函数，将图片名信息转成图片URL路径信息
ImageData = (function genImageURL(imageDataArr) {
  for (var i = 0, j = imageDataArr.length; i < j; i++) {
    var singleImageData = imageDataArr[i];
    singleImageData.imageURL = require('../images/' + singleImageData.fileName);
    imageDataArr[i] = singleImageData;
  }
  return imageDataArr;
})(ImageData);

//单个图片组件
class ImgFigure extends React.Component {

  render() {
    return (
      <figure>
        <img src={this.props.data.imageURL}
             alt={this.props.data.title}/>
        <figcaption>
          <h2>{this.props.data.title}</h2>
        </figcaption>
      </figure>
    );
  }
}

class GalleryAPP extends React.Component {
  render() {
    var controllerUnits = [],
      imgFigures = [];
    imageDatas.forEach(function (value) {
      imgFigures.push(<ImgFigure data={value}/>);
    });


    return (

      <section className="stage">
        <section className="img-sec">
          {imgFigures}
        </section>
        <nav className="controller-nav">
          {controllerUnits}
        </nav>
      </section>


    );
  }


}

GalleryAPP.defaultProps = {};

export default GalleryAPP;

Answer 1

Main.js?7cd4:13 Uncaught TypeError: Cannot read property 'fileName' of undefined    at genImageURL (eval at <anonymous> (app.js:2437), <anonymous>:35:80)    at Object.eval (eval at <anonymous> (app.js:2437), <anonymous>:39:2)    at Object.eval (eval at <anonymous> (app.js:2437), <anonymous>:119:27)    at eval (eval at <anonymous> (app.js:2437), <anonymous>:120:30)    at Object.<anonymous> (app.js:2437)    at __webpack_require__ (app.js:556)    at fn (app.js:87)    at Object.eval (eval at <anonymous> (app.js:1051), <anonymous>:15:13)    at Object.eval (eval at <anonymous> (app.js:1051), <anonymous>:24:27)    at eval (eval at <anonymous> (app.js:1051), <anonymous>:25:30)