Advanced components not work in vue-router

[dimensi]

Version

Vue-router 2.7.0
Vue 2.4.4

Reproduction link

https://codesandbox.io/s/5zyw568ojk

Steps to reproduce

1. create route
2. add in component property, arrow func with object

() => ({
      component: import('./components/Calendar/Calendar.vue'),
      loading: PageLoader,
    })

3. change network speed in devtools

What is expected?

I expect to see my component loader while the async component is loading

What is actually happening?

The loading component is not shown and the route is not changed until the async component loads.

Comments

https://vuejs.org/v2/guide/components.html#Advanced-Async-Components

[yyx990803]

From the docs you linked to:

Note that when used as a route component in vue-router, these properties will be ignored because async components are resolved upfront before the route navigation happens. You also need to use vue-router 2.4.0+ if you wish to use the above syntax for route components.

[affanshahid]

I am facing the same issue. The docs no longer show this message, I assumed the message was removed because vue-router now supports this. Is this incorrect? If so docs should show the message again.

[posva]

See #2140