reactJs内の別のコンポーネントからtimeinterval関数を呼び出すにはどうすればよいですか？

Question

私はapp.jsとSetInterval.jsのような2つのコンポーネントを持っています。この関数は、setinterval.jsを呼び出すときに呼び出されます。今私はapp.js.から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値を取得する必要があります。

Answer 1

setIntervalのコンポーネントを作成して何をしようとしているのか分かりません。しかし、反応成分がrender機能を有することが必須である。

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

これで動作します。

また、Componentクラスから拡張してクラスを作成する場合は、getInitialState関数を記述しないでください。