URL Shortening API Landing Page with React JS and Tailwind CSS

Community feedback

• 

  Eileen dangelo•1,600

  @Eileenpk

  Posted over 2 years ago

  Hi Revin! your project looks great, and I made a merge request on your GitHub repo to show you how I added a ref to your project as you asked. I just commented out the old code so after you merge you can go back and clean it up.

  It's important to note that using dynamic refs to access DOM elements and React components should be used with care, as it can make the code more difficult to understand and maintain.

  Also, with the release of React 16.3, you can use the callback method of creating refs, this method is recommended, and how I implemented the solution. Basically what I did was-

      const ref = useCallback(node => {
          if (node !== null) {
              // do something with the node
              navigator.clipboard.writeText(node.innerText);
          }
      }, []);
  
  <p ref={ref} id={`result-${result.id}`}></p>
  

  Hope you found this helpful!

  • Let's connect on LinkedIn! - @Eileenpk

  13

  Marked as helpful