import React, { Component } from 'react';
import { connect } from "react-redux";
import './videoKindList.css'
import { Link } from 'react-router-dom';
const mapStateToProps = (state) => ({

});

const mapDispatchToProps = (dispatch) => ({

});

class VideoKindListViews extends Component {
    /*
    * 构造函数
    *
    * */
    constructor() {
        super();
        this.state = {
            list: [{
                image: require('./../../assets/images/kemu1.png'),
                title: "科目一"
            }, {
                image: require('./../../assets/images/kemu2.png'),
                title: "科目二"
            }, {
                image: require('./../../assets/images/kemu3.png'),
                title: "科目三"
            }, {
                image: require('./../../assets/images/kemu4.png'),
                title: "科目四"
            }]

        };
    }




    /*
    *
    * 生命周期一
    *
    * */
    componentWillMount() {
        /*
        *
        * 如果是ios设备默认第一次不是播放状态，android没事
        *
        * */


        /*
        *
        *  请求数据
        *
        *
        * */

    }



    /*
    *
    * 生命周期二
    *
    * */
    componentDidMount() {

    }

    /*
    * 渲染
    * */
    render() {
        return (
            <div className="container">
                <div className="list">
                    {
                        this.state.list.map((item, index) => {
                            return (
                                <Link key={index} to={
                                    './videoList?subject='+(index+1)
                                }>
                                    <div className="list-item" key={index}>
                                        <img className="list-item-img" src={item.image} alt="图片" />
                                        <span className="list-item-text top54 ">{item.title}</span>
                                        <span className="list-item-text top128 left40">《视频讲解》</span>
                                    </div>
                                </Link>


                            )
                        })

                    }
                </div>
            </div>

        )
    }

    componentWillUnmount() {

    }
}

export default connect(mapStateToProps, mapDispatchToProps)(VideoKindListViews);