AddThis: <script> tag attached to <body> only works on first page load and doesn't persist throughout App ReactJS

Question

I am integrating AddThis.com's service. I am suppose to do

 ` <script
      type="text/javascript"
      src="//s7.addthis.com/js/300/addthis_widget.js#pubid=#my special code"
    ></script>`

And then I am able to use their div class:

` <div
    class="addthis_inline_share_toolbox"
    style={{ marginTop: "1.5rem", marginLeft: "1rem" }}
 />`

I attached the script tag in body, and I attached that div class in some component that definitely lies within the body. When I refresh my page, the div class displays as intended, but when I travel to another component and then back, that div doesn't appear. Any insights?

Answer 1

scripts belong in the head, not the body.

It sounds like you are only rendering it on the one page, navigate away and it's gone.

Since it's a script tag, and react treats any element as a valid node, it will remove the script tag when navigating away from your page, but the js is still in memory. reload and it's not in memory and there is no script tag anymore.

AddThis: <script> tag attached to <body> only works on first page load and doesn't persist throughout App ReactJS

Question

1 answers

solution1
0 2019-03-08 04:37:48

AddThis: <script> tag attached to <body> only works on first page load and doesn't persist throughout App ReactJS

Question

1 answers

solution1 0 2019-03-08 04:37:48

solution1
0 2019-03-08 04:37:48