Download actual HTML page in VueJS

I’m new to Javascript and VueJS.
I’ve built a project using VueJS, but the page doesn’t interact with any database. My aim is to enable editing on the preview, and upon completion, when I click the “Download” button, the page should save the edits as an HTML file.
Below is the code snippet for the button:

<v-dialog :retain-focus="false" v-model="dialogImport" max-width="600px">
  <template v-slot:activator="{ on }">
    <button id="boutonTelechargement" depressed small color="secondary" class="mr-2" @click="save()">
      <v-icon small class="mr-2">mdi-download</v-icon>Download HTML
    </button>
  </template>
</v-dialog>

I tried the blob function:

function save() {
  var htmlContent = ["your-content-here"];
  var bl = new Blob(htmlContent, {type: "text/html"});
  var a = document.createElement("a");
  a.href = URL.createObjectURL(bl);
  a.download = "your-download-name-here.html";
  a.hidden = true;
  document.body.appendChild(a);
  a.click();
}

The “your-content-here” section is currently static, meaning it only takes what I manually write into it. Is there a method to automatically populate it with all the content displayed in the preview? Thank you.