[1756] Going 'back' from a nested child route triggers async data in the parent

Problem

On our index page we have a <nuxt-child /> outlet in order to render the main page and display a login modal if the user navigates to /login. The login page is basically just a modal that gets plopped into the <nuxt-child /> outlet.

The index page component has an asyncData method that makes an expensive api call. When the login modal is closed the router goes back to the parent route. /login => / At this point asyncData is triggered again even when it's already rendered underneath.

Expectation

Expected behavior would for asyncData to not trigger as the parent route was never really exited and it should just maintain its existing state.

Solution

I have a hacky workaround in our index#asyncData method as seen here

asyncData ({ from, route }) {
  const routeName = route.name

  if (from && from.name.indexOf(routeName) === 0) {
    return Promise.resolve({})
  }

  return apiService.makeCall().then(({ data }) => data)
}

This seems to solve the issue but I'm just curious if always calling asyncData is intended behavior or not. Or otherwise a better solution that I'm not seeing.