title: Run function AFTER route fully rendered in Nuxt.js
body: <h2>Background:</h2>
  <p>I'm building an SSR website using Nuxt. I want to run a script to <a href="https://github.com/andybelldesign/typemate" rel="nofollow noreferrer">fix some typography issues</a> (orphaned text in headers). I can't do this UNTIL AFTER the DOM is rendered. How can I implement this function once so it runs after each page's DOM is rendered? It can be either in the Router or in a Nuxt Layout, or elsewhere.</p>
  <h2>What I've tried:</h2>
  <ol>
  <li><p>In my <code>layout.vue</code>, <code>Mounted()</code> only runs on the first load (as expected) and adding <code>$nextTick</code> doesn't seem to affect that. This is even true for generated static pages served from a real webserver.</p>
  </li>
  <li><p>In my <code>layout.vue</code>, using Vue's <code>Updated()</code> never seems to fire. I assume this means Nuxt is getting in the way.</p>
  </li>
  <li><p>Using <code>app.router.afterEach()</code> the function runs on each route change (including first load), but way before the DOM is rendered making it worthless.</p>
  </li>
  <li><p>If I add <code>Vue.nextTick()</code> into the <code>.afterEach()</code> the function runs on the current page JUST BEFORE the route changes (you can see it flash) but DOES NOT run before that.</p>
  </li>
  </ol>
  <h2>What works but seems dumb:</h2>
  <p>Putting the function in the <code>Mounted()</code> block on each page.</p>
  <pre><code>mounted: function(){
      this.$nextTick(function () {
      const tm = new TypeMate(undefined, { selector: 'h2, h3, p, li' });
      tm.apply();
       
      })
    },
  </code></pre>
  <p>But this seems like a bad idea especially as we add pages. What am I missing? Is there a smart way to do this? Nuxt's documentation is next to useless for some of this stuff.</p>