React.js implement menu [highlight active link]

Question

The following React.js code renders a navbar with two links named \'about\' and \'project\'. On page load the \'about\' link is active and colored red. When the other link is

Answer 1

maybe slightly less verbose... in Pseudocode

const menuItems = [
   'projects',
   'about',
];

class MenuExample extends React.Component {

  _handleClick(menuItem) { 
    this.setState({ active: menuItem });
  }

  render () { 
    const activeStyle = { color: '#ff3333' };

    return (
       
  
         {menuItems.map(menuItem => 
             
              {menuItem}
            
         )}
       
    );    
  }
}