react中使用屏保

1,默认路由路径为屏保组件

 <HashRouter history={hashHistory}>
                     <Switch>
                      <Route exact path="/" component={ScreenSaver} />
                         <Route exact path="/brandIntroduce" component={BrandIntroduce} />
                         <Route exact path="/category" component={Category} />
                         <Route exact path="/productList/:id" component={ProductList} />
                         <Route exact path="/productDetail/:id" component={ProductDetail} />
                         <Route exact path="/officialWebsite" component={OfficialWebsite} />
                     </Switch>
                 </HashRouter>

2,render部分，父级加入点击事件

 <div className="main-container" onClick={this.handleClick}>

3,点击事件，定时10分钟，无点击屏幕，调到屏保组件中，起到屏保作用

     handleClick() {
         clearTimeout(timeout1);
         timeout1 = setTimeout(() => {
             LocalServices.saveSelectedSlide('');
             hashHistory.push('/');
             // location.reload();
         },100000);
     },