HerringtonDarkholme / av-ts

A modern, type-safe, idiomatic Vue binding library
MIT License
216 stars 11 forks source link

Error on working with vue-router #40

Closed allenchen88 closed 7 years ago

allenchen88 commented 7 years ago

We are using this library and vue-router 2.0 to create a application and received below error in Chrome. So what is the correct implementation to integrate av-ts with vue-router?

[Vue warn]: Error when rendering component <router-link> My vue file is like this:

<template> <div><router-link to="/team"> Go to team </router-link> </div> </template>

HerringtonDarkholme commented 7 years ago

As far as I know, there is no dependency between Vue router and av-ts.

@Component class Foo extends Vue {}
@Component class Bar extends Vue {}

// 2. Define some routes
// Each route should map to a component. The "component" can
// either be an actual component constructor created via
// Vue.extend(), or just a component options object.
// We'll talk about nested routes later.
const routes = [
  { path: '/foo', component: Foo },
  { path: '/bar', component: Bar }
]

// 3. Create the router instance and pass the `routes` option
// You can pass in additional options here, but let's
// keep it simple for now.
const router = new VueRouter({
  routes // short for routes: routes
})

// 4. Create and mount the root instance.
// Make sure to inject the router with the router option to make the
// whole app router-aware.
const app = new Vue({
  router
}).$mount('#app')

// Now the app has started!

Should work. Note your code snippet merely imports vue-router but does not attach it to Vue instance. So no router-link is found during rendering.