title: Recommended way of waiting on an Apollo query before rendering the next page?
body: <p>When using the <a href="https://github.com/nuxt-community/apollo-module" rel="nofollow noreferrer">Apollo module</a> in a Nuxt app, the default behavior when changing routes is to render the new page immediately, before data has been fetched via Apollo.</p>
  
  <p>This results in some pretty janky rendering experiences where the page does a partial render and very soon after completes rendering with data from the server, making everything on the page shift due to the changing size of components that now have data. This looks pretty bad because the data actually comes back fairly quickly, so it would be fine to wait for the data to return before rendering the new route.</p>
  
  <p>What's the recommended way of waiting on the Apollo queries on a page (and its subcomponents) to complete before rendering the page?</p>
  
  <p>(There's <a href="https://github.com/vuejs/vue-apollo/issues/598" rel="nofollow noreferrer">a related question</a> that's not specific to Nuxt, but I'm not sure how to translate the recommendation to a Nuxt app.)</p>
  
  <p>I'd love to see a code example of using <code>beforeRouteEnter</code> to fetch data via Apollo and only entering the route once the data is fetched.</p>