SHARE
TWEET

Untitled

a guest Jun 18th, 2019 67 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from "react";
  2. import ReactDOM from "react-dom";
  3. import debounce from "lodash.debounce";
  4.  
  5. const TestFunc = ({ count, onClick }) => {
  6.   const handleClick = debounce(() => {
  7.     onClick();
  8.     console.log(count);
  9.   }, 500);
  10.  
  11.   return (
  12.     <div>
  13.       <button type="button" onClick={handleClick}>
  14.         Func: {count}
  15.       </button>
  16.     </div>
  17.   );
  18. };
  19.  
  20. class TestClass extends React.Component {
  21.   handleClick = debounce(() => {
  22.     this.props.onClick();
  23.     console.log(this.props.count);
  24.   }, 500);
  25.  
  26.   render() {
  27.     return (
  28.       <div>
  29.         <button type="button" onClick={this.handleClick}>
  30.           Class: {this.props.count}
  31.         </button>
  32.       </div>
  33.     );
  34.   }
  35. }
  36.  
  37. const App = () => {
  38.   const [countClass, setCountClass] = React.useState(0);
  39.   const [countFunc, setCountFunc] = React.useState(0);
  40.  
  41.   return (
  42.     <div>
  43.       <TestFunc count={countFunc} onClick={() => setCountFunc(countFunc + 1)} />
  44.       <TestClass
  45.         count={countClass}
  46.         onClick={() => setCountClass(countClass + 1)}
  47.       />
  48.     </div>
  49.   );
  50. };
  51.  
  52. ReactDOM.render(<App />, document.getElementById("root"));
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top