即使状态可见性为假,图像仍会渲染

我计划渲染一个元素,或者仅在单击按钮时使元素可见。但是元素会被渲染而不受影响。即使日志显示状态为假

getInitialState: function(){
    return {
        number: 0,
        'image1': "https://www.bignerdranch.com/img/blog/2014/07/Button-2.png",
        visible1: false          
    }
},

add: function(){
    var number = this.state.number;
    number = number+1;
    console.log(number);
    var temp = "visible"
    temp = temp + number
    var s ={};
    s[temp] = true;
    console.log(s);
    this.setState(s); 
},


render: function(){
    return(
      <div>
        <img  className={"addpicture "+this.state.visible1?"visible":"invisible"} onClick={this.camera} src={this.state.image1} data-cam={1}/>
        <button onClick={this.add}>Click me</button>
        {console.log(this.state.visible1)}
      </div>
    );
}