react中如何判断点击最后一个元素，显示输入框

Question

const age = [
    {name: '56岁以上'},
    {name: '51-55岁'},
    {name: '41-50岁'},
    {name: '31-40岁'},
    {name: '24-30岁'},
    {name: '23岁及以下'},
    {name: '其他'},
];

 constructor(props) {
        super(props);
        this.state = {
            issSelect: '',
        };
        this.setsCur = this.setsCur.bind(this)
    }

setsCur(e) {
        this.setState({
            issSelect: Number(e.currentTarget.getAttribute('index'))
        });
    }

render() {
        return (
            <div className="upcoming-tab">
                {
                    age.map((item, i) => {
                        return<div className="upcoming-item">
                            <a key={i} index={i} className={this.state.issSelect === i ? 'active' : ''}
                               onClick={this.setsCur}>{item.name}</a>
                        </div>
                    })
                }
                <Flex justify="between" className="statistics-tit">
                    <input type="number" pattern="[0-9]" placeholder="开始年龄"/>
                    <span>至</span>
                    <input type="number" pattern="[0-9]" placeholder="截止年龄"/>
                </Flex>
            </div>
        )
    }

Answer 1

{
  index === last ? <input/> : null
}

怎么，jsx很难吗

Answer 2

className={this.state.issSelect === age.length ? 'show' : 'hide'}