vue + ts遇到的问题总结

问题1：Element implicitly has an ‘any’ type because type ‘TraceTool’ has no index signature.

解决方法：在组件头部加这段代码

declare module 'vue/types/vue' {
    interface Vue {
        [key: string]: any,
    }
}

参考链接：vuejs+typescrpt this[key] 使用变量获取this属性报错解决办法Elemen

问题2：for (… in …) statements must be filtered with an if statement

解决方法：

for (const key of Object.keys(obj)) {
	this[key] = obj[key]
}

解析：Object.keys()方法，返回的是对象本身的可枚举属性

参考链接：报错tslint/ codelyzer / ng lint error: “for (… in …) statements must be filtered with an if statement

问题3：Could not find a declaration file for module ‘vue-json-viewer’

试了很多方法，其中包括：在tslint.json添加下面这段代码，并没有起作用

"noImplicitAny":  false

解决方法：

// js
import JsonViewer from 'vue-json-viewer';
Vue.component('JsonViewer', JsonViewer);

// html
<json-viewer :expand-depth=2 copyable :value="this.currentSpan.outputValue || ''"></json-viewer>

参考链接：[1] Could not find a declaration file for module ‘vue-xxx’

问题4：Value of key ‘XX’ is not a string!

解决方法：在使用这个插件的地方，添加silentTranslationWarn: true 这段代码

const i18n = new VueI18n({
  locale: language,
  messages: {
    zh,
    en,
  },
  silentTranslationWarn: true // 重点
});