Overview
The Nuxt Property Decorator is a library that provides ES/TypeScript decorators for class-style Vue components in Nuxt. It is based on the Vue class component and Vue property decorator libraries, as well as the Vuex Class library. This library is fully dependent on vue-class-component.
Features
- Nuxt specific decorators:
@Off
- decorator of$off
@On
- decorator of$on
@Once
- decorator of$once
@NextTick
- decorator of$nextTick
- Vue specific decorators:
@Emit
@Inject
@InjectReactive
@Model
@ModelSync
@Prop
@PropSync
@Provide
@ProvideReactive
@Ref
@VModel
@Watch
- Vuex specific decorators:
@State
@Getter
@Action
@Mutation
- Other exports:
namespace
mixins
- Vue Router hooks:
beforeRouteEnter
,beforeRouteUpdate
,beforeRouteLeave
- Nuxt hooks:
asyncData
,fetch
,fetchOnServer
,head
,key
,layout
,loading
,middleware
,scrollToTop
,transition
,validate
,watchQuery
- Vue-class Hooks:
data
,beforeCreate
,created
,beforeMount
,mounted
,beforeDestroy
,destroyed
,beforeUpdate
,updated
,activated
,deactivated
,render
,errorCaptured
,serverPrefetch
Installation
The installation process for the Nuxt Property Decorator is very easy. You can install it using either of the following methods:
- If you are using Nuxt JS, it works out of the box with Nuxt JS.
- If you are using Nuxt TS, it also works out of the box with Nuxt TS.
Summary
The Nuxt Property Decorator is a useful library for working with class-style Vue components in Nuxt. It provides a variety of decorators for Nuxt, Vue, and Vuex, as well as other useful features such as Vue Router hooks and Nuxt hooks. The installation process is straightforward, making it easy to incorporate into your Nuxt projects.