为react组件库添加typescript类型提示的方法


Posted in Javascript onJune 15, 2020

以我自己的组件react-better-countdown为例,

首先在package.json里面添加types: types/index.d.ts

为react组件库添加typescript类型提示的方法

然后文件目录上添加对应文件夹和文件,

为react组件库添加typescript类型提示的方法

最后是index.d.ts文件的编写,具体看代码:

import * as React from 'react';

interface CountdownProps {
  count?: number;
  dayText?: string | React.ReactElement;
  hourText?: string | React.ReactElement;
  minuteText?: string | React.ReactElement;
  secondText?: string | React.ReactElement;
  callback?: Function;
  className?: string;
  style?: React.CSSProperties;
  rest?: any
}

interface CountdownState {
  count?: number;
}

declare module 'react-better-countdown' {
  export default class Countdown extends React.Component<CountdownProps, CountdownState> {
    state: CountdownState;
    timer: null | number;
    tick: () => void;
    componentDidMount(): void;
    componentDidUpdate(prevProps: CountdownProps): void;
    componentWillUnmount(): void;
    render: () => React.ReactElement;
  }
}

更多详细代码看仓库:https://github.com/leeseean/react-better-countdown顺便求个Star!

到此这篇关于为react组件库添加typescript类型提示的方法的文章就介绍到这了,更多相关react组件库添加typescript类型提示内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
初识JQuery 实例一(first)
Mar 16 Javascript
动态加载dtree.js树treeview(示例代码)
Dec 17 Javascript
jquery跟js初始化加载的多种方法及区别介绍
Apr 02 Javascript
ajaxFileUpload.js插件支持多文件上传的方法
Sep 02 Javascript
对JavaScript客户端应用编程的一些建议
Jun 24 Javascript
jQuery检查事件是否触发的方法
Jun 26 Javascript
基于jquery实现鼠标滚轮驱动的图片切换效果
Oct 26 Javascript
js中substr,substring,indexOf,lastIndexOf,split,replace的用法详解
Nov 09 Javascript
快速学习jQuery插件 Cookie插件使用方法
Dec 01 Javascript
jQuery ajax分页插件实例代码
Jan 27 Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 Javascript
webpack 如何解析代码模块路径的实现
Sep 04 Javascript
JavaScript中的全局属性与方法深入解析
Jun 14 #Javascript
Vue使用Three.js加载glTF模型的方法详解
Jun 14 #Javascript
浅谈Vue 自动化部署打包上线
Jun 14 #Javascript
JS定时器如何实现提交成功提示功能
Jun 12 #Javascript
Jquery ajax书写方法代码实例解析
Jun 12 #jQuery
ng-alain的sf如何自定义部件的流程
Jun 12 #Javascript
如何在微信小程序中使用骨架屏的步骤
Jun 12 #Javascript
You might like
分享下PHP register_globals 值为on与off的理解
2013/09/26 PHP
PHP常用技术文之文件操作和目录操作总结
2014/09/27 PHP
PHP strcmp()和strcasecmp()的区别实例
2016/11/05 PHP
Javasipt:操作radio标签详解
2013/12/30 Javascript
jquery中get和post的简单实例
2014/02/04 Javascript
jQuery中next()方法用法实例
2015/01/07 Javascript
JavaScript获取URL汇总
2015/06/08 Javascript
Web程序员必备的7个JavaScript函数
2016/06/14 Javascript
dul无法加载bootstrap实现unload table/user恢复
2016/09/29 Javascript
BootStrap中Table分页插件使用详解
2016/10/09 Javascript
微信js-sdk上传与下载图片接口用法示例
2016/10/12 Javascript
jquery实现(textarea)placeholder自动换行
2016/12/22 Javascript
jQuery实现贪吃蛇小游戏(附源码下载)
2017/03/04 Javascript
图片懒加载imgLazyLoading.js使用详解
2020/09/15 Javascript
node.js实现上传文件功能
2019/07/15 Javascript
vue打开其他项目页面并传入数据详解
2020/11/25 Vue.js
python调用cmd复制文件代码分享
2013/12/27 Python
python实现合并两个数组的方法
2015/05/16 Python
matplotlib在python上绘制3D散点图实例详解
2017/12/09 Python
PyQt5每天必学之布局管理
2018/04/19 Python
在PyCharm导航区中打开多个Project的关闭方法
2019/01/17 Python
在Python函数中输入任意数量参数的实例
2019/07/16 Python
django中瀑布流写法实例代码
2019/10/14 Python
python turtle 绘制太极图的实例
2019/12/18 Python
Python的赋值、深拷贝与浅拷贝的区别详解
2020/02/12 Python
基于Python脚本实现邮件报警功能
2020/05/20 Python
python自动生成sql语句的脚本
2021/02/24 Python
波兰运动鞋网上商店:e-Sporting
2018/02/16 全球购物
大学军训感言1000字
2014/02/25 职场文书
网吧消防安全责任书
2014/07/29 职场文书
2014党员整改措施思想汇报
2014/10/07 职场文书
2015年新农合工作总结
2015/03/30 职场文书
2016先进工作者事迹材料
2016/02/25 职场文书
Java并发编程之详解CyclicBarrier线程同步
2021/06/23 Java/Android
Java对文件的读写操作方法
2022/04/29 Java/Android
Python如何用re模块实现简易tokenizer
2022/05/02 Python