How do I render a standalone component on NUXT 2 which doesn't destroy on route change-CodePudding

Usually in vue 2, you render a component that doesn't close on route change, you include it directly in your app.vu file. How do I achieve this in nuxt 2.

I am trying to implement a chat module and don't want to include the component on every instance it is needed (That will mean new socket connection on every route)

Is there a workaround?

CodePudding user response：

Put that in your default layout, it should be enough.
More info here: https://nuxtjs.org/docs/concepts/views/#default-layout

Something like this in /layouts/default.vue

<template>
  <div>
    <nav>
      <ul>
        <li>
          <NuxtLink to="/">Home</NuxtLink>
        </li>
        <li>
          <NuxtLink to="/parent">Parent</NuxtLink>
        </li>
      </ul>
    </nav>
    <main>
      <img src="~/assets/logo.svg" />
      <Nuxt />
    </main>
  </div>
</template>

And a simple page should do it

<template>
  <div>
    <h1>Hello Nuxters!