react

最新推荐文章于 2022-06-27 16:41:16 发布

我才不会写BuG_

最新推荐文章于 2022-06-27 16:41:16 发布

阅读量112

点赞数

分类专栏：陈宝

本文链接：https://blog.csdn.net/weixin_47752439/article/details/107190366

版权

陈宝专栏收录该内容

4 篇文章 0 订阅

订阅专栏

import React,{ Component } from "react";
import axios from 'axios';
import "./first.css"
class First extends Component{
    constructor(props) {
        super(props);
        this.state = { 
            list:[],
            tab:0,
            contentList:{}
        };
    }
    componentDidMount(){
        this.getList()
    }
    clicked(index){
        this.setState({tab:index},()=>{
            console.log(this.state.tab)
        })
    }
    getList(){
        axios.get('http://localhost:4000/showList').then(res => {
            this.setState({list:res.data});
        }) 
    }
    render(){
        return (
            <div>
                <div className="top">
                    {
                        this.state.list.map((item,index)=>{
                            return (
                                <div key={index} className="tabs" onClick={this.clicked.bind(this,index)}>{item.name}</div>
                            )
                        })
                    }
                </div>
                <div className="xiix">
                    {
                        this.state.list.map((it,index)=>{
                            return it.subjects.map((itt,index1)=>{
                                return (
                                <div className={index===this.state.tab ? "active" :''}>{itt.title}</div>
                                )
                            })
                        })
                    }
                </div>
            </div>
        )
    }
}
export default First;