react 组件封装原则_react 封装tab组件

import React, { Component } from 'react'

export default class index extends Component {

constructor(props){

super(props)

this.state = {

currentIndex:0

}

}

check_title_index( index ){

return index === this.state.currentIndex ? "tab_title active" : "tab_title"

}

render() {

return (<>

{

React.Children.map(this.props.children, (element, index) => {

return ({

this.setState({

currentIndex:index

})

}} className={index === this.state.currentIndex?"active":''}>{element.props.name})

})

}

{

React.Children.map(this.props.children, (element, index) => {

return ({element.props.children}

)

})

}