Vue3+Vite+TS项目构建报错TS2345的定位疑问

问题根源 #

你遇到的TS2345错误，核心原因是v-for的:key绑定了方法引用而非方法执行结果：

:key="hourAtDefaultCity.toUnixInteger"

这里的toUnixInteger是Luxon DateTime对象的方法，不加括号的话，传递给key的是方法本身，类型为() => number，而Vue要求key的类型必须是string | number | symbol | undefined，因此触发类型不匹配错误。

开发环境（npm run dev）中Vue的类型校验相对宽松，会隐式忽略这类问题，但构建时TS会严格执行类型检查，所以报错。

解决方案 #

修改:key绑定，调用toUnixInteger方法获取返回的数值：

:key="hourAtDefaultCity.toUnixInteger()"

验证修改 #

修改后，key的类型变为方法返回的number，符合TS的类型要求，构建时即可通过校验。

补充说明 #

你的locTime函数返回的是Luxon DateTime实例，toUnixInteger()是该实例的标准方法，调用后会返回对应的Unix时间戳整数，完全满足v-for对key唯一性的要求。

内容的提问来源于stack exchange，提问作者WoJ