Question

如果用户点击元素然后在元素上添加一个类，我想做什么，而且，我有下面的重复代码，我想在触发组件或添加类时触发单击循环的第一个元素。

无论哪种可行。

Object.keys(this.state.cdata).map((id,val) => {
    return (
        <div key={val}  onClick={this.select.bind(this, this.state.cdata[id].id)} >
            <div><i className="fa fa-globe" aria-hidden="true"></i> 
                <div className="country-name">{this.state.cdata[id].name}</div>
                <input type="text" value={this.state.cdata[id].name} className="hidden"  onChange={this.edit}   onKeyPress={this.check}/>
            </div>
        </div>
    )
})

Answer 1

我认为您可以使用componentDidMount，例如：

componentDidMount() {
    this.setState({ loaded: 'newClass' });
}

在您的代码中，只需通过检查索引

来添加类

Object.keys(this.state.cdata).map((id,val) => {
    return (
        <div key={val} className={val === 0 && this.state.loaded} onClick={this.select.bind(this, this.state.cdata[id].id)} >
            <div><i className="fa fa-globe" aria-hidden="true"></i> 
                <div className="country-name">{this.state.cdata[id].name}</div>
                <input type="text" value={this.state.cdata[id].name} className="hidden"  onChange={this.edit}   onKeyPress={this.check}/>
            </div>
        </div>
    )
})

单击react js循环中的第一个元素

1 个答案: