警告：setState（...）：只能更新已安装或已安装的组件。这通常意味着你叫的setState（）卸载的组件

Question

我得到这样的警告上：

Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the App component.  

还有它似乎已经安装我已经做了注册后两次组件中的问题。然后，如果我再次注册，则为3次。我怎样才能解决这个问题？例如，如果我输入消息，则会打印两次或三次。

var App = React.createClass({ 
     getInitialState: function() { 
      return { messages: AppStore.getMessages() }; 
     }, 
     componentDidMount: function() { 
      var socket = io('http://localhost:3000'); 
      AppStore.addChangeListener(this._onChange); 
      AppStore.addSocket(socket); 
     }, 
     componentUnmount: function() { 
      AppStore.removeChangeListener(this._onChange); 
     }, 
     render: function() { 
      return (
       <div> 
        <ChannelsColumn/> 
        <Messages messages={this.state.messages}/> 
        <div className="footer"> 
         <MessageInput/> 
        </div> 
       </div> 
      ) 
     }, 
     _onChange: function() { 
      this.setState({ messages: AppStore.getMessages() }); 
     } 
    }); 

Signup.js 

    var Signup = React.createClass({ 
     getInitialState: function() { 
      return { 
       email: '', 
       password: '' 
      }; 
     }, 
     onChangeEmail: function(e) { 
      this.setState({ email: e.target.value }); 
     }, 
     onChangePassword: function(e) { 
      this.setState({ password: e.target.value }); 
     }, 
     handleSubmit: function() { 
      var self = this; 
      axios.post('/signup', { email: this.state.email, password: this.state.password }) 
       .then(function(response) { 
        sessionStorage.setItem('token', response.data.token); 
        self.props.history.push('/'); 
       }); 
     }, 
     render: function() { 
      return (
       <div> 
        <header id="signup-header"> 

        </header> 

        <form id="signup-form"> 
         <section className="form-content"> 
          <input type="text" placeholder="Email" value={this.state.email} onChange={this.onChangeEmail}/> 
          <input type="password" placeholder="Password" value={this.state.password} onChange={this.onChangePassword} id="password-field"/> 
         </section> 
         <div className="button-container"> 
          <div type="submit" className="large-blue-button" onClick={this.handleSubmit}>Sign Up</div> 
         </div> 
        </form> 

       </div> 
      ) 
     } 
    }); 

main.js

ReactDOM.render((
    <Router> 
     <Route path="/" component={App} /> 
     <Route path="login" component={Login} /> 
     <Route path="signup" component={Signup} /> 
    </Router>), 
    document.getElementById('app') 
); 

Answer 1

你有错字，React可是没有像componentUnmount这样的方法应该是componentWillUnmount。 React docs

谢谢