yongqianvip / rncountdown

通过点击按钮，在按钮上显示倒计时

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)， 按钮恢复可点击状态，但不会开始倒计时

rncountdown's Issues

安装你这个以后，打开就报错

禁用后的背景颜色能否修改

If the button is not clickable, can the background color be changed

渲染时就执行倒计时

1. 没有渲染时就执行倒计时的方法

为什么import之后会报undefined is not an object的错。。

点击后没反应