TS Vue 裝飾器是一種在 Vue.js 應用程序中使用 TypeScript 時，用于對類和類成員進行注釋和元數據聲明的特殊語法注釋。Vue.js從2.5.0開始支持裝飾器語法，這個特性旨在使Vue.js應用程序更具可讀性和可維護性。

裝飾器語法可以用于聲明類的成員，例如，在組件中聲明動畫效果：

@Component
export default class MyComp extends Vue {
@State prop1: string;
@Mutation('SET_PROP2') setProp2: (value: string) =>void;
@Action('actionName') actionName: () =>Promise;
@Getter('getterName') getterName: string;
@animate({ duration: 1000 })
runAnimation() {
// ...
}
}

上述代碼使用兩種不同的裝飾器。第一種是與 Vuex 數據存儲框架集成的裝飾器：@State、@Getter、@Mutation 和@Action。這些裝飾器將 class 的成員（以函數調用的形式指定）標記為需要連接到 Vuex store。第二種是動畫之類的自定義動作，使用@animate 裝飾器。

在 Vue.js 組件中使用裝飾器還可以聲明依賴項：實例的屬性或其他組件中的方法，使用@Inject 裝飾器實現:

@Component
export default class InputMixin extends Vue {
@Prop({ default: false })
allowEmpty: boolean;
@Provide('form')
getForm() {
return this;
}
inputValidator(value: string) {
if (!this.allowEmpty && value.trim().length === 0) {
return 'Value is required';
}
return '';
}
inputLengthValidator(value: string) {
if (value.length< 5) {
return 'Value must be at least 5 characters long';
}
return '';
}
}
@Component
export default class MyInput extends InputMixin {
@Inject('form')
form: InputMixin;
get errorMessage() {
return this.form.inputValidator(this.inputValue) || this.form.inputLengthValidator(this.inputValue);
}
get hasError() {
return !!this.errorMessage;
}
}

在上面的代碼中，我們使用@Inject 裝飾器將父類的依賴項注入到子類當中。此外，我們還使用了@Provide 裝飾器，將組件 itself 提供給其他組件，使它們可以在子組件中引用相應的方法。

最后，我們要注意的是，在使用 TS Vue 裝飾器時，類必須定義為 ES6 類而不是 ES5 函數。要使用裝飾器修飾函數，必須使用 Babel 或 TypeScript 轉譯器。