skip to Main Content

I have a share button on my react app,when someone clicks it, i want the share pop up to come up on the web app and share the link on any mobile app

i wanted to implement it using intent links, but all articles say about react-native

2

Answers


  1. can you try this? If you are in mobile browser, this will open whatsapp app on your phone. If you are in desktop browser it will open whatsapp web url

    const shareURL = "https://www.codewithmilan.com" // or any url
       <a key={name} href=`https://wa.me/?text=${shareURL}` target="_blank" 
        rel="noreferrer">
         WhatsApp Share Button
       </a>
    
    Login or Signup to reply.
  2. Solution : URL Schemes

    Code

    const ShareButton = () => {
      const handleShareClick = () => {
        const textToShare = encodeURIComponent(
          'Check out this awesome link: https://example.com'
        );
        const whatsappUrl = `whatsapp://send?text=${textToShare}`;
        window.location.href = whatsappUrl;
      };
    
      return <button onClick={handleShareClick}>Share on WhatsApp</button>;
    };
    
    function App() {
      return (
        <div>
          <h1>My React App</h1>
          <ShareButton />
        </div>
      );
    }
    

    You can use URL Schemes, Adding screenshot to show how it opens whatsapp either in phone or macos.

    enter image description here

    If you click on Open Whatsapp, it opens whatsapp and show screen that asks for contacts to send this text.

    • choose contacts on whatsapp
    • click send.
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search