Tweet Button Empty

HTML-CSS
1

I am currently doing my random quote machine for the front-end framework projects using React and I am stuck at the tweet button. The button keeps giving an empty string when it goes to twitter. How can I put a variable as the text when it directs it to Twitter?

My code so far:

<a  class="button" id="tweet-quote" href="https://twitter.com/intent/tweet?text={quote}"  rel="noreferrer" title="Tweet this quote!" target="_blank">
  <FontAwesomeIcon icon={faXTwitter} />
</a>
2 
<a
  className="button"
  id="tweet-quote"
  href={`https://twitter.com/intent/tweet?text=${encodeURIComponent("{quote}")}`}
  rel="noreferrer"
  title="Tweet this quote!"
  target="_blank"
>
  <FontAwesomeIcon icon={faXTwitter} />
</a>

use ${} to include the JavaScript expression, and use encodeURIComponent to properly encode the {quote} value for a URL.

1 Like
3

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.