Composition-api: help: Uncaught TypeError occurred when using `vue-router-next`

[125Dal]

📚 What are you trying to do? Please describe.

When I use useRouter of vue-router-next to move pages, Uncaught TypeError occurred.

🔍 What have you tried?

1. npm i vue-router@4 to install vue-router-next

2. I tried to use useRouter

import { defineComponent } from '@nuxtjs/composition-api'
import { useRouter } from 'vue-router'

export default defineComponent({
  setup () {
    const router = useRouter()
    const buttonClicked = () => {
      router.push('/foo')
    }
    return { buttonClicked }
  }
})

1. TypeError occurred

Uncaught TypeError: Object(...) is not a function
    at Module.eval (vue-router.esm-bundler.js?6c02:2042)
    at eval (vue-router.esm-bundler.js:3357)
    at Module../node_modules/vue-router/dist/vue-router.esm-bundler.js (app.js:2609)
    at __webpack_require__ (runtime.js:854)
    at fn (runtime.js:151)
    at eval (router.js:15)
    at Module../.nuxt/router.js (app.js:383)
    at __webpack_require__ (runtime.js:854)
    at fn (runtime.js:151)
    at eval (index.js:33)

ℹ️ Additional context
I can move pages using nuxt-link component.

[danielroe]

@125Dal Nuxt isn't yet compatible with vue-router@next, and depends on a different version of vue-router. If you want to access the router, you can do so using:

const { app: { router } } = useContext()

More details in the docs.

[125Dal]

@danielroe
Thank you for answering !