vue+typscript项目中遇到的问题

问题

• typescript引入没有声明过的第三方库
• typescript中使用map forEach filter find遍历用[]取属性时报错Element implicitly has an 'any' type because expression of type 'string' can't b...
• vue原始项目转换为ts写法的批量转换方式

解答

1.声明第三方库

• 有的第三方库是有声明文件的，这时我们只需要
  npm install @types/{模块名}

• 没有声明文件的第三方库

  • 在项目的src下建一个@type文件夹，在这个文件夹下去编写声明文件
  • 例子

// main.ts

import { VeRadarChart } from 've-charts'
Vue.component('VeRadarChart', VeRadarChart)

// @types/definition.d.ts
declare module 've-charts' {
  export class VeRadarChart {
  }
}

像这样声明一下就能用了

2.用[]获取属性报错

// index.vue
import Service from './service.ts'

const tService: any = Service

// Service不能直接被遍历获取属性，但是tService可以
let _promises = this.formItem.map(({service}: any): any => {
  return tService[service]()
})

// Promise.all...........xxxx......

// service.ts
export default {
  async getList(params) {
    return await XXXXXX
  }
}

// const.ts
type FormItem<T> = {
  label: T
  prop: T
  type: T
  service: T
}
export const formItem: Array<FormItem<any>> = [
  {
    label: '投诉类型',
    prop: 'complainType',
    type: 'select',
    service: 'getComplainType'
  },
  {
    label: '问题维度',
    prop: 'problemDim',
    type: 'select',
    service: 'getProblemDim'
  },
  {
    label: '用户风险等级',
    prop: 'riskLevel',
    type: 'select',
    service: 'getRiskLevel'
  }
]

3.批量转换方式

大佬的转换神器