react native 实现TextInput分割验证码输入框自定义组件

如上图设计效果，是我们常见的需求效果，我的实现思路：

1. 默认验证码值为空，使用lodash库中的padEnd方法末尾补齐五位空格，

2. 我们通过split('')分割输入的字符串验证码为一个个数字的数组；

3. 遍历分割后的数组，渲染每一个输入格的组件；

4. 将TextInput组件和渲染好的五个输入格放在View的组件下包裹， TextInput组件可以尽可能小的显示；

5. 给渲染好的五个输入格添加点击事件，让TextInput键盘获取焦点。

具体实现代码我会附上我的代码，欢迎留言提供更好的解决方案。

https://github.com/aijason/react-native-verifyCodeInput

如果实用，记得给个star吧！