通过点击按钮，在按钮上显示倒计时
RNCountDown
点击按钮发送请求获取验证码，获取成功后按钮上显示倒计时
install：
npm install react-native-smscode-count-down --save
usage：
import CountDownButton from 'react-native-smscode-count-down'
...
<CountDownButton
style={{width: 110,marginRight: 10}}
executeFunc={(shouldStartingCounting)=>{
this.shouldStartingCounting = shouldStartingCounting
}}
textStyle={{color: 'blue'}}
timerCount={60}
timerTitle={'获取验证码'}
enable={phoneNum.length > 10}
onClick={(shouldStartCountting)=>{
//随机模拟发送验证码成功或失败
const requestSucc = Math.random() > 0.5;
shouldStartCountting(requestSucc)
}}
timerEnd={()=>{
this.setState({
state: '倒计时结束'
})
}}/>
| props | type | default value | mark |
|---|---|---|---|
| onClick | func | - | 点击后触发，同时将按钮置为不可用，配合shouldStartCountting 使用 |
| timerCount | number | 60 | 倒计时时长 |
| shouldStartCountting | func | - | 决定是否开始倒计时的回调函数，参数类型Bool |
| style | View style | - | - |
| textStyle | Text style | - | - |
| disableColor | string | gray | 按钮不可用状态下的颜色 |
| enable | bool | false | 按钮是否可用（比如用户输入合法手机号时可用，否则不可用） |
| timerEnd | func | - | 倒计时结束的回调函数 |
| timerTitle | string | 获取验证码 | - |
| timerActiveTitle | array | ['重新获取（', 's）'] | 倒计时的数字会插在数组第一项之后，如：['请在', '秒后重新获取']，显示为【请在60秒后重新获取】 |
| executeFunc | func | - | 倒计时组件加载完成后，立刻回吐开始倒计时的方法shouldStartCountting(看下边注释)， 把这个方法绑定到当前对象，可以通过手动调用触发倒计时(具体用法可以参考App.js中的实现) |
shouldStartCountting：回调函数，接受一个Bool类型的参数
shouldStartCountting(true)，开始倒计，但按钮仍不可点击，直到倒计时结束
shouldStartCountting(false)， 按钮恢复可点击状态，但不会开始倒计时
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
