Javascript Reactjs:不显示错误消息

我有一个非常简单的React案例，其中render函数中有一个错误，当状态更新为包含错误值时，不会记录任何内容。当我检查生成的源代码时，data error属性正在更新，因此这可能是MaterializeCS的问题。控制台中不显示任何错误

我做错了什么

    var {ipcRenderer, remote} = require('electron');  
var mainProcess = remote.require("./main.js");
class YouTubeDownloaderForm extends React.Component 
    {
      constructor(props) 
      {
        super(props);
        this.state = 
        {
          url: '', 
          urlInvalid: false,
          urlsInformation:[]
        };
        this.handleAddClick = this.handleAddClick.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);      
        this.handleChangeClick = this.handleChangeClick.bind(this);
        this.handleUrlChange = this.handleUrlChange.bind(this);
        this.updateUrlInformation = this.updateUrlInformation.bind(this);
      }
      componentDidMount() 
      {
        ipcRenderer.on('UrlInformation', this.updateUrlInformation)
      } 
      componentWillUnmount() 
      {
        ipcRenderer.removeListener('UrlInformation', this.updateUrlInformation)
      }

      updateUrlInformation(event, arg) 
      {
        if(arg=== false)
        {
          this.setState({urlInvalid: true});
          return;
        }
        this.setState({urlInvalid: false});

        var urlsInformation = this.state.urlsInformation;
        urlsInformation.push(arg);
        this.setState({urlsInformation: urlsInformation});
        this.setState({url: ''});
      }

      handleAddClick(event) 
      {      
        mainProcess.getUrlInformation(this.state.url);
      }
      handleUrlChange(event) 
      {
        this.setState({url: event.target.value});
      }
      handleChangeClick(event) 
      {
      }
      handleSubmit(event) 
      {
        event.preventDefault();
      }
      render() 
      {
        return (
          <form className="col s12" onSubmit={this.handleSubmit}>
            <div className="row">
              <div className="input-field">
                <input id="Url" type="text" value={this.state.url} className="validate" onChange={this.handleUrlChange}></input> 
                <label id="UrlLabel" htmlFor="Url" data-error={this.state.urlInvalid===true?'The entered url seems to be invalid. ':''}>Url</label>                     
              </div>          
        </div>
        </form>
        );
      }
    }
    ReactDOM.render(<YouTubeDownloaderForm/>, document.getElementById('root'));

var{ipcdrenderer，remote}=require（'electron'）；
var mainProcess=remote.require（“./main.js”）；
类youtubeDownloadPerform扩展React.Component
{
建造师（道具）
{
超级（道具）；
此.state=
{
url:“”，
URL无效：false，
URL信息：[]
};
this.handleAddClick=this.handleAddClick.bind（this）；
this.handleSubmit=this.handleSubmit.bind（this）；
this.handleChangeClick=this.handleChangeClick.bind（this）；
this.handleUrlChange=this.handleUrlChange.bind（this）；
this.updateUrlInformation=this.updateUrlInformation.bind（this）；
}
componentDidMount（）
{
ipcRenderer.on（'UrlInformation'，this.updateUrlInfo）
} 
组件将卸载（）
{
ipcRenderer.removeListener（'UrlInformation'，this.UpdateUrlinInformation）
}
updateUrlInformation（事件，参数）
{
如果（arg==false）
{
this.setState（{urlvalid:true}）；
返回；
}
this.setState（{urlvalid:false}）；
var urlsinfo=this.state.urlsinfo；
urlsInformation.push（arg）；
this.setState（{urlsInformation:urlsInformation}）；
this.setState（{url:'}）；
}
handleAddClick（事件）
{      
mainProcess.getUrlInformation（this.state.url）；
}
handleUrlChange（事件）
{
this.setState（{url:event.target.value}）；
}
handleChangeClick（事件）
{
}
handleSubmit（事件）
{
event.preventDefault（）；
}
render（）
{
返回(
网址
);
}
}
ReactDOM.render（，document.getElementById（'root'））；

---

ipcRenderer变量来自哪里

你确定你的JS控制台是空的吗

---

也许错误边界可以帮你一点忙，检查一下，我可以通过接管输入字段的验证来解决这个问题。希望这对别人有帮助

i、 易变

<input id="Url" type="text" value={this.state.url} className="validate" onChange={this.handleUrlChange}></input>

到

---

谢谢@dfeyer。我删除了IPC渲染器以显示更紧凑的代码。我把它加了回去。js控制台是空的。我会检查错误边界，或者在MaterializeCSS论坛上发布。

<input id="Url" type="text" value={this.state.url} className={this.state.urlInvalid===true?'invalid':''} onChange={this.handleUrlChange}></input>