选择图像并在用户单击时滚动浏览页面

Question

我有50张照片清单，这些照片可以从API获取。用户单击任何照片时，应在右侧组件上打开。

单击右侧组件中的照片时，应向下滚动（如果图像不在顶部）页面中该图像所在的位置。

import React from 'react';
import axios from 'axios';
import '../App.css';


class Dashboard extends React.Component {
  constructor(props) {
    super(props);
    this.state={
        image:'abc',
    }
  }

  imageload(appendimage){
    this.setState({
        image:appendimage
    })
  }

componentWillMount() {
    axios.get('http//api')
    .then((res) => this.setState({
        results: res.data
    }))
    .catch((error)=>{
        console.log(error)
    })
}

  render() {
    return (
        <div>
           <div className="left">
            <img  width="373" height="230" alt="img3" id="mytarget"
                onClick={this.imageload.bind(this,"https://i.ytimg.com.jpg")} 
                src="https://i.ytimg.com/vi/.jpg"
            />
          </div>

          <div className="right>
           <img src={this.state.ima} height={510} width={400}
                                alt="placeholderimg"
                                style={{position:"fixed"}}
                                className={classes.staticimg}
                                onClick={this.imageredirect.bind(this)} 
           />
         </div>
        </div>
    );
  }
}

export default withStyles(style)(Dashboard);