React - Handling events

0 votes
217 views
added Mar 8, 2019 in React by LC Marshal Captain (25,790 points)

In order to prevent HTML default link from opening new page, you simply code:

<a href="#" onclick="console.log('I get clicked.'); return false">
  Click here
</a>

 

In react, you need to do it with  preventDefault

// React
function LinkMe() {
  function handleClick(e) {
    e.preventDefault();
    console.log('I get clicked');
  }

  return (
    <a href="#" onClick={handleClick}>
      Click here 
    </a>
  );
}

 

1 Response

0 votes
responded May 14, 2019 by LC Marshal Captain (25,790 points)
(:Social button:)
const watsapp = () => {
    window.open('https://wa.me/?text='+ window.location.href,+'targetWindow','height=600,width=660,resizable=no,toolbar=no,menubar=no,status=no,location=no,scrollbars=yes');
};

<a className="social-share" onClick={whatsapp}>
    <img src="/images/social-icon/whatsapp-logo.png" height="20" className="social-icon" alt="Lazacode" />
</a>

 

lazacode.org - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.
...