Community Developer Events

Lou_Rectoret
by:
Participant

Hubspot's Form integration in Vue.js

I struggled a bit to integrate my first HS form in my project. Here's the code I came up with:

 

 

 

<template>
  <h1>
    HubSportForm
    <div id="hubspotForm" v-once></div>
  </h1>

</template>

<script>
  export default {
    mounted() {
    const script = document.createElement("script");
    script.src="https://js.hsforms.net/forms/v2.js";
    document.body.appendChild(script);
    script.addEventListener("load", () => {
      if (window.hbspt) {
        window.hbspt.forms.create({
          portalId: "your-portal-id",
          formId: "your-form-id",
          target: "#hubspotForm"
        })
      }
    })
  }
}
</script>

 

 

 

 

 

3 Comments