Göster Hata Mesajını Gizle Reactjs içinde 5ms sonra

Question

Bir div içinde bir hata mesajı göstermek istiyorum ve 5ms canlı kalmasını istiyorum, bundan sonra yok olacak ve bir sonraki mesaj geldiğinde tekrar canlı olacak.

<div id="error"> <UserSignupMessagesView /> </div> 

$(".error").slideDown(); 
     setTimeout(function() { 
      $(".error").slideUp(); 
     }, 5000); 

Ama hiç yardımcı olmuyor: Böyle çalışıyorum. Lütfen Yardım. Hata nasıl üretildiğini

Answer 1

var UserSignupMessagesView = React.createClass({ 
    getInitialState: function(){ 
    return{ 
     display: 0, 
     message: "" 
    } 
    }, 
    changeDisplay: function(count){ 
    this.setState({display: this.state.display + count}) 
    }, 
    setErrorMsg: function(message){ 
    this.setState({message: message}) 
    }, 
    render: function(){ 
    return(
     <div> 
     <ErrorGenerator newMessage={this.setErrorMsg} 
         displayOrNot={this.changeDisplay}/> 
     {(this.state.display!=0) ? 
     <DisplayIt message = {this.state.message} /> 
     : null} 
     </div> 
    ) 
    } 
}); 

    var ErrorGenerator = React.createClass({ 
    handleUserInput: function(){ 
     this.props.newMessage($("#input").val()); 
     //**handle displaying and hiding of the message state 
     this.props.displayOrNot(1); 
     setTimeout(function(self) { 
      self.props.displayOrNot(-1); 
     }, 5000, this); 
     //** 
    }, 
    render: function(){ 
     return(
     <div> 
     demo: input an error: <input id = "input" type= "text" /><br /> 
     <button type="button" onClick={this.handleUserInput}>Click Me</button> 
     </div> 
    ) 
    } 
    }); 

    var DisplayIt = React.createClass({ 
    render: function(){ 
     return <div id = "error"> {this.props.message} </div> 
    } 
    }); 

    React.render(
    <UserSignupMessagesView />, 
    document.getElementById('myDiv') 
) 

Im emin, bu yüzden o (ErrorGenerator bileşeni) simüle etmek için bir giriş metin kutusu yapılmış değil. 'Beni tıkla' düğmesine her bastığınızda, yeni yazılan Msg görüntülenecektir, ardından 5 saniye sonra kaybolacaktır. Yeni bir msg girerseniz ve 5 saniye sonundan önce "beni tıkla" yı seçerseniz, tekrar sizin için 5 saniye sayacaktır.