这是我参与「第四届青训营 」笔记创作活动的第3天。

经过上一篇的基础学习（如果您未学习TS的基础，可以前往查看），本篇我们整理几个TS新手可能会遇到的的坑。

常见问题

TypeScript处理事件时，提示“xxx在类型EventTarget上不存在”

在做Low-Code的拖拽事件时，TS告诉我，handler函数的参数event上没有dataset，这是为什么？

这是因为ts默认将e.target认成EventTarget类型，而EventTarget上确实没有dataset。

我们稍加分析，已知触发事件的e.target是个div标签，而这个dataset在HTMLDivElement上是有的，只是ts将e.target认成了EventTarget。那么我们只需断言其类型为对应元素的HTML Element，就可以找到dataset。

最后，由于event.dataTransfer()方法只接受string类型，所以还需断言一下你所给变量的类型为string。

当然了，如果你执意要用any，也不是不行。

直接回到JS。

TS里使用数组的方法出现问题“not assignable”（push、splice等）

仔细去看，你会发现这数组是个never[]。当数组声明时没有给定类型，TS会将其推断为never[]，并提示“Error: Argument of type 'xxx' is not assignable to parameter of type 'never'”，其实就是忘了给数组上类型声明，加上类型声明即可。

TypeScript模块化

起因是在写pinia的store时，想要统一用上ts。

结果类型都上好了，发现在ts里无法直接引入其他.ts模块。一开始我是不信提示的：改成.js。总觉得需要改改配置或者装点插件什么的。假设store文件夹中有一个store.ts：

import useStore from '../store/store.ts'; 
//  An import path cannot end with a '.ts' extension. Consider importing '../store/store.js' instead.

结果真就这样。

import useStore from '../store/store'; 

可以再缩写成store，就不必写后缀了。