软件教程 2025年08月6日
0 收藏 0 点赞 717 浏览 1186 个字
摘要 :

文章目录 解决方案 在使用typescript开发时,经常会使用any类型,因为很方便,任何类型都能接收,尤其是对第三方库里面的数据类型,只要使用any,任何问题都解决了!但……




  • 解决方案

使用typescript开发时,经常会使用any类型,因为很方便,任何类型都能接收,尤其是对第三方库里面的数据类型,只要使用any,任何问题都解决了!但是,我们不建议使用any类型!

什么是 any?any不是通配符,也不是基类型,它是明确地与第三方库进行交互。any 类型可让代码在编译期间逐渐选择加入和选择退出类型检查机制。使用 any 可能允许我们在不考虑数据类型的情况下更简单地开发,但它将这个负担会转移到后期维护的程序员身上。

那现在如果不用any,我们在整合了第三方库的时候,有些组件里面的属性我们是不知道什么类型的,该怎么办?比如,潘老师最近做项目就遇到了这样的问题,该项目是使用的antd组件库,其中有个Radio单选按钮带有onChange事件,具体代码如下:

// template
<a-radio-group v-model:value="formState.roleCode" :onChange="handleChange">
    <a-radio v-model:value="item.roleCode" v-for="(item, index) in roleArr" :key="index">
        {{item.roleName}}
    </a-radio>
</a-radio-group>
// 方法
const handleChange= (e : any) => {
    const value= e.target.value
    alert(value);
};

从官网上看,e的类型时Event,如下图:
typescript any类型不建议使用,如何查找第三方库的对应类型?
但是,当我将any换为Event是还是会报错,因此,我又在ant-design-vue查找到该组件,在其ts中找到了RadioChangeEvent类型,但无法import进来,而且这么个找法,不得累死。

解决方案

于是问了下,前端同事,他给出的解决方案就是:自定义一个类型,该类型中有你需要用到的属性即可,所以现在的思路不再是如何查找第三方库的对应类型,而是自己缺啥造啥(当然有的能找到直接import还是比较好的,毕竟可能有的很复杂)于是我的修改如下:

1)自定义types.ts

// radio切换事件类型
interface RadioEvent {
    target : RadioEventTarget
}
interface RadioEventTarget {
    value : string
}
export {
    RadioEvent
}

2)在组件中import,并使用

// 导入
import { RadioEvent } from "./types";
// 方法
const handleChange= (e : RadioEvent) => {
    const value= e.target.value
    alert(value);
};

然后测试了下,仍然可以正常使用,问题解决!由于潘老师不是专门做前端的,也不知道这么做好不好,如果你有更好的看法,欢迎分享!

微信扫一扫

支付宝扫一扫

版权: 转载请注明出处:https://www.zuozi.net/6097.html

管理员

相关推荐
2025-08-06

文章目录 一、Promise基础回顾 二、Promise 与 axios 结合使用场景及方法 (一)直接返回 axios …

269
2025-08-06

文章目录 一、模块初始化时的内部机制 二、常见导出写法的差异分析 (一)写法一:module.exports…

107
2025-08-06

文章目录 一、ResizeObserver详解 (一)ResizeObserver是什么 (二)ResizeObserver的基本用法 …

683
2025-08-06

文章目录 一、前期准备工作 (一)下载相关文件 (二)安装必要工具 二、处理扣子空间生成的文件…

338
2025-08-06

文章目录 一、官方文档 二、自动解包的数据类型 ref对象:无需.value即可访问 reactive对象:保持…

371
2025-08-06

文章目录 一、Hooks的工作原理 二、在if语句中使用Hook会出什么岔子? 三、React官方的Hook使用规…

843
发表评论
暂无评论

还没有评论呢,快来抢沙发~

助力内容变现

将您的收入提升到一个新的水平

点击联系客服

在线时间:08:00-23:00

客服QQ

122325244

客服电话

400-888-8888

客服邮箱

122325244@qq.com

扫描二维码

关注微信客服号