将参数传递给组件

创建一个图像数组，并通过props传递:

import React from 'react';
const Slider = ({ images }) => (
  <div>
  <div id="myCarousel" className="carousel slide" data-ride="carousel">
      <div className="carousel-inner" role="listbox">
         <div>
            {images.map(({ src, alt}) => (
               <div className="item">
                  <img src="http://placehold.it/1250x250" alt="Flower" />
               </div>
            )}
        </div>
        <a className="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
          <span className="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
          <span className="sr-only">Previous</span>
        </a>
        <a className="right carousel-control" href="#myCarousel" role="button" data-slide="next">
          <span className="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
          <span className="sr-only">Next</span>
        </a>
    </div>
    <br /><br />
  </div>
);
export default Slider;
// example of usage in parent
class App extends Component {
  constructor(props) {
    super(props);
    
    this.state = {
      images: [
    	{ src: "http://placehold.it/1250x250", alt": "Chania" },
	    { src: "http://placehold.it/1250x250", alt": "Chania" },
	    { src: "http://placehold.it/1250x250", alt": "Flower" },
	    { src: "http://placehold.it/1250x250", alt": "Flower" }
      ]
    };
  }
  render() {
     return (
        <Slider images={ this.state.images } />
     );
  }
}