How to install ShareThis on Vue js?

Question

I tried to put this in public index.html:

 <script type='text/javascript'
src='https://platform-api.sharethis.com/js/sharethis.js#property=5f4e15b2e56e550012ae1e77&product=inline-share-buttons'
async='async'></script>

then I put this in the component:

      <div class="sharethis-inline-share-buttons"></div>

but nothing is showing...

any help how do I make it work?

Answer 1

Found this short tutorial in case someone else is struggling with this problem.
https://motorscript.com/share-this-component-for-vue-nuxt/

you should create a component ShareThis.vue and apply it to your code

<template>
  <div class="share-this">
    <!-- This is the placement code ShareThis provides. -->
    <div class="sharethis-inline-share-buttons"></div>
  </div>
</template>

<script>
export default {
  mounted() {
    const st = window.__sharethis__
    if (!st) {
      const script = document.createElement('script')
      script.src =
        'https://platform-api.sharethis.com/js/sharethis.js#property=[property_id]>&product=sop'
      document.body.appendChild(script)
    } else if (typeof st.initialize === 'function') {
      st.href = window.location.href
      st.initialize()
    }
  }
}
</script>


<style scoped>
.share-this {
  margin-bottom: 0.5em;
}
</style>

You have to build a vue component in order for it to work