addeventlistener to input react code example
Example 1: event listener for functional component
import React, { useEffect } from 'react';
const Component = (props) => {
useEffect(() => {
window.addEventListener('scroll', handleScroll);
});
useEffect(() => {
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
function handleScroll() {
let scrollTop = window.scrollY;
}
return ()
}
Example 2: react event listener
import React from 'react';
class App extends React.Component {
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;