Deliberately choose which async data going to be serialized to `window.__NUXT__`

DmytroYeremieiev
10
DmytroYeremieiev
commented 6 months ago

Basically, after page was rendered on a server side, I'm no longer need that asynchronous data used for rendering. It's played it's the only role in rendering the template and that's it, I don't need it anymore especially in runtime or cluttering HTML document.
For instance, I request an HTML chunk from a third party server. After it was placed into the page via v-html directive during server-side rendering I don't need it anymore.
Is it possible to choose which data is going to window.NUXT and which can escape serialization?

0
DmytroYeremieiev
10
DmytroYeremieiev
commented 6 months ago

Solved the problem by overriding serializer toJSON and picking own dom in a getter method getHTML:

<template>
  <section class="container">
    <div v-html="getHTML()"></div>
  </section>
</template>

 async asyncData(context) {
    const response = await axios.get('......')
    let asyncData =  { html: response.data }
    asyncData.toJSON = ()=> { html: null }
    return asyncData;
  },
  methods: {
    getHTML() {
      if(process.server){
        return this.html
      }
      if(!this.$el){
        return this.html
      }
      return this.$el.innerHTML
    }
  }
0
Informations
Question โ€ข Resolved
#c9089 - Created 6 months ago