vue-cli3.0 + Vuex + typescript:Member '...' implicitly has an 'any' type.

vue+typescript之后,vuex调用再也不是从前的调用方式了,需要加类型校验了

对比vuex在使用ts前后写法

在ts中使用vuex,需要在vue问价中导入对应的vuex装饰器

 import {State, Mutation} from 'vuex-class';

1. state

ts前

const Counter = {
  template: `
{{ count }}
`, computed: { count () { return this.$store.state.count } } }

ts后

@State private count !: number 
// 这个number直接当做变量调用即可

2. mutation

ts前

store.commit({
  type: 'increment',
  amount: 10
})

ts后

@Mutation private increment!: (amount: number) => void;

handleClick():void{
  this.increment(10)
}

其他用法:

  @State private setting!: SettingState;
  @Getter private syncData: any;
  @Mutation private changeHourly!: (checked: boolean) => void;
  @Action private sync!: (data: any) => void;

SettingState接口

export interface SettingState {
  checked: boolean;
  url: string;
}

你可能感兴趣的:(vue-cli3.0 + Vuex + typescript:Member '...' implicitly has an 'any' type.)