點(diǎn)擊不同的li來切換Content的內(nèi)容，請?jiān)趺床拍軐?shí)現(xiàn)，我這么寫無法變化為什么？

import React from 'react';
import './styles/index.less'

class Tab extends React.Component {
    constructor(){
        super()
        this.state = {
            list:['色情','暴力','政治','文化'],
            content:[
                [
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg'
                ],
                [
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg'
                ],
                [
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg'
                ],
                [
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg',
                    'http://192.168.1.247/data/chenjianyi/kuaishou300k/kuaishou_images/6307318905_0.jpg'
                ]
            ],
            current:0
        }
    }

    handleClick(index){
        this.setState({ current:index });
    }

    currentClass(index){
        return this.state.current === index ? 'current' : '';
    }

    contentClass(index){
        return this.state.current === index ? 'active' : '';
    }


    handleClickedLi (name, index) {
        const _self = this;
        console.log('點(diǎn)擊li == '+ index)

        _self.setState({
            current: index
        })
    }

    renderLi (name, index) {
        return (
            <li key={name} onClick={this.handleClickedLi.bind(this, name, index)} className={'on_locking_ul_li'}> {name} </li> )
    }

    render(){

        let contentBody = this.state.current && this.state.content.length != 0 &&
            this.state.content.map((value,index)=> {
                //console.log(value," ==", index);
                return (
                    this.state.current === 0 ? <div>0</div> :
                        this.state.current === 1 ? <div>1</div> :
                            this.state.current === 2 ? <div>2</div> :
                                this.state.current === 3 ? <div>3</div> : <div>5</div>
                )
            })

        return (
            <div className={"result_tab"}>
                <ul id="tab" >
                    //通過props的形式傳遞數(shù)據(jù)和方法給子組件
                    //::this es7的語法詳見https://github.com/tc39/proposal-bind-operator
                    { this.state.list.map( (val,index ) => {
                        //console.log(val," ==", index);
                        return this.renderLi(val, index)
                    }) }
                </ul>
                <div id="content">
                    {
                        contentBody
                    }
                </div>
            </div>
        )
    }
}


class List extends React.Component {

    handleClick(){
        //調(diào)用父組件的方法 將邏輯處理交給父組件
        this.props.handleClick(this.props.index);
    }
    render(){
        return(
            <li className={this.props.currentClass(this.props.index)} onClick={this.handleClick} >{this.props.val}</li>
        )
    }
}

class Content extends React.Component {

    render(){
        return(
            <div className={this.props.contentClass(this.props.index)} >{ this.props.val  }</div>
        )
    }
}

export default Tab;