React.js - Both images disappear onClick - how do I make only 1 disappear at

I'm trying to make an image disappear on React.js but if there are 2 images and one is clicked, they both disappear. I just need one to disappear at a time when they are clicked. I'm adding a class that will 'display:none' when clicked on.
class Home extends Component {
constructor(props) {
  super(props);
  this.state = {addClass: false}
}
handleClick() {
    this.setState({addClass: !this.state.addClass});
  }
render () {
    let clickedClass = ["beer"];
    if(this.state.addClass) {
        clickedClass.push('gone');
    }
    return (
        <div>
                    <img id="beer1" className={clickedClass.join(' ')} src={('/images/beer1.png')} onClick={(e) => this.handleClick(e)}/>
                    <img id="beer2" className={clickedClass.join(' ')} src={('/images/beer2.png')} onClick={(e) => this.handleClick(e)}/>
        </div>
    )
}
}

Комментарии

Популярные сообщения из этого блога

Skipping acquire of configured file 'contrib/binary-i386/Packages' as repository … doesn't support architecture 'i386'

Connection string for MariaDB using ODBC

Celery like system based on django channels