Skip to content
Snippets Groups Projects
Select Git revision
  • 28e7645b7eefa6b9472fb73dc6075c8c4f06aa39
  • main default protected
  • v5.2
  • v5.1
  • v7.1
  • v7
  • v6.2
  • v6.1
  • v6
  • v5.9
  • v5.8
  • v5.7
  • v5.6
  • v5.5
  • v5
  • v5.3
  • v4.6
  • v4.6-problem
  • v4.5
  • v4
  • v3.2
  • v3.1
22 results

person.component.jsx

Blame
  • person.component.jsx 714 B
    import { useState, useEffect } from 'react';
    
    // import stysheet defining style specific to this component
    import '../assets/style/person.css';
    
    /*
    * define a component that uses props, props is a javascript object
    */
    const Person = ( { name = 'Anonymous', age, started, delay } ) => {
       
       const [ currentAge, setCurrentAge ] = useState(age);
    
    
       useEffect( () => {
          if (started) {
             setInterval( () => setCurrentAge( previousCurrentAge => previousCurrentAge + 1 ), delay);
          }
       }, []);
    
       return (
          <div className="person">Here is :
             <div>name : <span>{ name }</span> </div>
             <div>age  : <span>{ currentAge } </span>  </div>
          </div>
       );
    }
    export default Person;