Interface ComponentCustomProperties

Custom properties added to component instances in any way and can be accessed through this

Example

Here is an example of adding a property $router to every component instance:

import { createApp } from 'vue'
import { Router, createRouter } from 'vue-router'

declare module '@vue/runtime-core' {
  interface ComponentCustomProperties {
    $router: Router
  }
}

// effectively adding the router to every component instance
const app = createApp({})
const router = createRouter()
app.config.globalProperties.$router = router

const vm = app.mount('#app')
// we can access the router from the instance
vm.$router.push('/')
Copy