如何从reactJs中的另一个组件调用timeinterval函数？

我有两个组件像app.js和SetInterval.js。调用setinterval.js时会调用该函数。现在我想从app.js中调用timeinterval函数。我将分享以下代码供您参考。如何从reactJs中的另一个组件调用timeinterval函数？

//App.js 
import React, { Component } from 'react'; 
import logo from './logo.svg'; 
import './App.css'; 
import SetInterval from './SetInterval'; 

export default class App extends Component { 

    render() { 

    return (
     <div className="App"> 
     <SetInterval /> 
     <div className="App-header"> 
      <img src={logo} className="App-logo" alt="logo" /> 
      <h2>Welcome to React</h2> 
     </div> 
     <p className="App-intro"> 
      To get started, edit <code>src/App.js </code> sadfsdfasdf and save to reload. 
     </p> 
     </div> 
    ); 
    } 
}

Setinterval.js

import React, { Component } from 'react'; 

export default class SetInterval extends Component { 
    constructor() { 
    super(); 

    this.state = { 
     secondsElapsed:0 
    }; 
    this.tick = this.tick.bind(this); 
} 
getInitialState(){ 
    return {secondsElapsed:0}; 
} 
    tick() { 
     let secondsElapsed = parseInt(this.state.secondsElapsed) + 1; 
    this.setState({secondsElapsed: this.state.secondsElapsed + 1}); 
    console.log(this.state.secondsElapsed) 
    if(this.state.secondsElapsed == 10){ 
     alert(1) 
    } 
    } 
    componentDidMount() { 
    this.interval = setInterval(this.tick, 1000); 
    } 
    componentWillUnmount() { 
    clearInterval(this.interval); 
    } 
}

我得靠赊账功能的每个呼叫的secondsElapsed值。

来源

2017-07-15 Eswar

getInitialState对于基于类的组件不是必需的。渲染方法应该显示secondElapsed。 – vijayst

感谢您的回复。 – Eswar

不知道你想通过编写一个组件setInterval做什么。但是React组件必须具有render函数。

class SetInterval extends React.Component { 
    // your code here 
    render() { 
    return <div>set interval</div> 
    } 
}

它现在会工作。

此外，当您通过从Component类扩展它来创建类时，请不要编写getInitialState函数。

来源

2017-07-15 10:11:03

是的，现在它的工作。非常感谢。一个我在导入中添加了React元素 – Eswar

我正在将oauth与我的项目集成以获取刷新标记。有没有最好的例子来获取刷新令牌。 – Eswar

如何从reactJs中的另一个组件调用timeinterval函数？

回答

相关问题