es6不支援在<img />標籤內直接寫圖片的路徑，即：
<img src="../images/photo.png"/>
這種格式是不支援的。在網上看了很多部落格，總結下以下幾個載入的方法，當然，這種是在圖片不多的情況下可以採用。

一.少量圖片的時候，單張引入
（1）import 方法：

import logos from '../../assets/images/logos.png';//src/assets
render() {
		return (
			<img alt="logo" src={logos} />
		)
	}

（2）require方法

<img alt="logo" src={require('../../assets/images/logos.png')}  />
 

這種方法需要注意的是，require裡只能寫字串，不能寫變數。
這兩種辦法可以解決圖片不多，在前端直接載入圖片路徑的問題。那麼，假設需要從資料庫中讀取圖片的路徑，require不能寫變數，import from後面也不能寫變數，那麼該怎麼辦呢，現在也假設兩種情況。

二.多圖片的時候

（1）圖片了不大的情況 且知道圖片順序的情況下
    json:

[
  {
    "name":'img1'
    "img":"img1",
    "url":""
  },
  {
    "name":"img2",
    "img":"img2",
    "url":""
  },
  {
    "name":"img3",
    "img":"img3",
    "url":""
  }
]
 

react:

import img1 from'./../images/img1.png';
import img2 from'./../images/img2.png';
import img3 from'./../images/img3.png';
 
const imgsArr = [img1,img2,img3];
 
render(){
    return(
        <div>
            {
                imgsArr.map(function(name){
                    return(
                        <img src={name} />
                    )
                }) 
            }
        </div>
    )
}
 

    這個只能滿足圖片量不大，且知道圖片載入順序的情況下。
（2）圖片量很大，且圖片順序需與json檔案的name一致
    這種情況下，看了網站上一個部落格，可以同時import 一個資料夾下面的圖片路徑放到一個數組arrIMGURL裡，就想到了一個方法，假設全部載入到圖片裡，在後臺json檔案的"img"屬性裡寫該圖片的名字a，在渲染的時候，遍歷存放圖片路徑陣列，假設arrIMGURL包含a,則渲染該圖片。程式碼如下：
    1、全部載入圖片路徑

const requireContext = require.context("./../img/project",true, /^\.\/.*\.png$/);
const projectImgs = requireContext.keys().map(requireContext);

  2、渲染

    createContent(){
        var _this = this;
        for (var i = 0;i<this.dataSource.length;i++){
            var columns = [];
            var imgURL;
            for (var j = 0; j < projectImgs.length;j++){
                if(projectImgs[j].indexOf(_this.dataSource[i].img) > 0){
                    imgURL = projectImgs[j];
                }
            }
            columns.push(<div className="projectImg"><img src={imgURL} alt=""/></div>);
            columns.push(<a href={_this.dataSource[i].url}>{_this.dataSource[i].name}</a>);
            result.push(<div className="projectContent">{columns}</div>);
 
        }
        return result;
    };