为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 相关文章推荐
IE浏览器打印的页眉页脚设置解决方法
Dec 08 Javascript
Jquery CheckBox全选方法代码附js checkbox全选反选代码
Jun 09 Javascript
node.js实现BigPipe详解
Dec 05 Javascript
JavaScript 匿名函数和闭包介绍
Apr 13 Javascript
jquery通过扩展select控件实现支持enter或focus选择的方法
Nov 19 Javascript
js简单设置与使用cookie的方法
Jan 22 Javascript
jQuery实现点击弹出背景变暗遮罩效果实例代码
Jun 24 Javascript
详解Angular的内置过滤器和自定义过滤器【推荐】
Dec 26 Javascript
微信小程序 PHP后端form表单提交实例详解
Jan 12 Javascript
关于JavaScript中高阶函数的魅力详解
Sep 07 Javascript
iview同时验证多个表单问题总结
Sep 29 Javascript
vue+spring boot实现校验码功能
May 27 Vue.js
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生成带有雪花背景的验证码
2006/10/09 PHP
PHP脚本数据库功能详解(上)
2006/10/09 PHP
php strftime函数获取日期时间(switch用法)
2018/05/16 PHP
jQuery使用手册之三 CSS操作
2007/03/24 Javascript
在JavaScript中,为什么要尽可能使用局部变量?
2009/04/06 Javascript
javascript的数据类型、字面量、变量介绍
2012/05/23 Javascript
js禁止document element对象选中文本实现代码
2013/03/21 Javascript
js setTimeout 参数传递使用介绍
2013/08/13 Javascript
javascript full screen 全屏显示页面元素的方法
2013/09/27 Javascript
Js获取数组最大和最小值示例代码
2013/10/29 Javascript
javascript省市级联功能实现方法实例详解
2015/10/20 Javascript
基于jquery实现全屏滚动效果
2015/11/26 Javascript
基于jQuery和hwSlider实现内容左右滑动切换效果附源码下载(一)
2016/06/22 Javascript
js调用父框架函数与弹窗调用父页面函数的简单方法
2016/11/01 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
2017/04/14 jQuery
JS 调试中常见的报错问题解决方法
2017/05/20 Javascript
对layui中表单元素的使用详解
2018/08/15 Javascript
详解JavaScript函数callee、call、apply的区别
2019/03/08 Javascript
基于JavaScript实现轮播图效果
2021/01/02 Javascript
Python实现对excel文件列表值进行统计的方法
2015/07/25 Python
pytorch: tensor类型的构建与相互转换实例
2018/07/26 Python
python爬取微信公众号文章
2018/08/31 Python
Python Pexpect库的简单使用方法
2019/01/29 Python
python爬虫豆瓣网的模拟登录实现
2019/08/21 Python
Pytorch实现各种2d卷积示例
2019/12/30 Python
opencv中图像叠加/图像融合/按位操作的实现
2020/04/01 Python
python如何求100以内的素数
2020/05/27 Python
HTML5 DeviceOrientation实现手机网站摇一摇功能代码实例
2015/04/24 HTML / CSS
利用异或运算实现两个无符号数的加法运算
2013/12/20 面试题
日期和时间问题
2015/01/04 面试题
企业文化演讲稿
2014/05/20 职场文书
临床医学专业求职信
2014/08/08 职场文书
“三支一扶”支教教师思想汇报
2014/09/13 职场文书
小学生安全教育广播稿
2014/10/20 职场文书
画展邀请函
2015/01/31 职场文书
一文带你理解vue创建一个后台管理系统流程(Vue+Element)
2021/05/18 Vue.js