Выполнять код каждую секунду (Таймер)
В React есть метод componentDidMount()
, который выполняется после создания компонента.
class App extends React.Component { // выполнять код после render() componentDidMount() {} render() { return ( <div className="react-app"> <p>Приложение React</p> </div> ); } }
Первоначальный рендеринг компонента называется «монтирование» (mounting).
В данном методе можно добавить JavaScript-функцию setInterval()
, которая задаёт интервал выполнения указанного кода.
class Items extends React.Component { constructor(props) { super(props); // создать переменную "seconds" this.state = {seconds: 0}; } componentDidMount() { // выполнять код каждую секунду setInterval(() => this.setState((state) => ({ seconds: ++state.seconds })), 1000 ); } render() { return ( <p>Прошло секунд: {this.state.seconds}</p> ); } } // Вывод данных в элементе "#app" ReactDOM.render(<Items />, document.getElementById("app"));
Поддержать автора