Zero Learning Curve
No framework-specific concepts to master. If you know TypeScript and vue-router, you're already 90% there. Bring new developers onto your project without the usual framework onboarding overhead.
MVC Controllers for Vue Router
Clean, decorator-based routing without the complexity of state management libraries
Are you tired of the complexity that comes with Vuex or Pinia for simple route-based state management? Vue3 Routable brings the simplicity of MVC patterns to Vue 3 applications, letting you organize your route logic without the overhead of global state management libraries.
Most Vue applications end up with one of these common patterns:
Vue3 Routable introduces a lightweight, decorator-based approach that:
import { Routable, RouteActivated, RouteDeactivated, Param } from 'vue3-routable'
import productModel from '@/models/product-model'
@Routable('/products/:id')
class ProductController {
@RouteActivated()
async loadProduct(@Param('id') productId: string) {
productModel.data = await fetchProduct(productId);
}
@RouteDeactivated()
cleanup() {
// Clean up subscriptions, timers, etc.
}
}
Ready to simplify your Vue routing? Get started with the guide or explore the API documentation.