event listener in react

var Box = React.createClass({
  getInitialState: function() {
    return {windowWidth: window.innerWidth};
  },

  handleResize: function(e) {
    this.setState({windowWidth: window.innerWidth});
  },

  componentDidMount: function() {
    window.addEventListener('resize', this.handleResize);
  },

  componentWillUnmount: function() {
    window.removeEventListener('resize', this.handleResize);
  },

  render: function() {
    return <div>Current window width: {this.state.windowWidth}</div>;
  }
});

ReactDOM.render(<Box />, mountNode);

Posted by: Guest on June-20-2020

Source

// it a component import React from 'react'; class App extends React.Component { //call function (ECMAScript 5) from tag input:text handleChange = e => { // console.log(`${e.target.value}`) } render() { return ( <div className="App"> <input type="text" name="input" id="" placeholder="" onChange={this.handleChange}/> </div> ); } } export default App;

class Button extends React.Component { scream() { alert('AAAAAAAAHHH!!!!!'); } render() { return <button onClick={this.scream}>AAAAAH!</button>; } } ReactDOM.render(<Button />, document.getElementById('app'));

Code answers related to "event listener in react"

Code answers related to "Javascript"

Javascript Answers by Framework

Browse Popular Code Answers by Language

Answers for "event listener in react"

Code answers related to "event listener in react"

Code answers related to "Javascript"

Javascript Answers by Framework

Browse Popular Code Answers by Language

Popular Programming Languages

Advertisements

Company

Compilers

Help

Connect with us