2

I created a project with Vue CLI and now I need slot value inside the mounted function.

I can access slot with this.$slots.default and I got VNode array.

Now I need to convert VNode array into the HTML string like for example:

const html = `<p><strong>Lorem</strong> ipsum</p>`;

My currently code looks like this:

<TestComponent field="website" :data="document">
    <p><strong>Lorem</strong> ipsum</p>
</TestComponent>


<template>
  <div class="test">
        <p>lorem ipsum</p>
  </div>
</template>

<script>
export default {
  props: ["field", "data"],
  data() {
    return {
      editor: null,
    };
  },
  mounted() {
    if (this.$slots.default) {
      const html;
      console.log(this.$slots.default);
    }
  },
};
</script>
Xstyler
  • 103
  • 2
  • 6
  • There is no way to transpile the VNode back to a DOM element (Raw HTML, as you ask) – Ohgodwhy Jan 13 '20 at 18:29
  • @Ohgodwhy I could do something like this: `this.$slots.default.forEach(e => { htmll += "<" + e.tag + ">test" + e.tag + ">"; });` but there is a problem because I will have different HTML structures. – Xstyler Jan 13 '20 at 19:06

0 Answers0