import React from 'react'
import "./index.less"

export default class SmallTab extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            selectedItem: this.props.items[0]
        }
    }

    render() {
        const { selectedItem } = this.state
        return (
            <div className="smallTab">
                {
                    this.props.items.map(item => (
                        <span className={selectedItem.title == item.title ? "tabItem tabItemSelected": "tabItem"} onClick={() => {this.setState({selectedItem: item}); this.props.onChange(item)}}>{item.title}</span>
                    ))
                }
            </div>
        )
    }
}