Taro React组件使用（4） —— RuiInputCode 验证码输入框

1. 效果

2. 实现

1. RuiInputCode 验证码输入框组件需求分析

1. 验证码的位数，确定输入的最大验证码个数是多少，一般是6或4，默认为6位；
2. 是否自动聚焦，可能存在点击输入框后聚焦，也可能加载页面自动聚焦；
3. 输入后填写后验证码和未填写不同的样式。

2. 验证码输入框组件实现

1. 需要存在一个实际的input的输入框，输入值，但是对该input的进行隐藏；
2. 使用view循环模拟对应位数的输入框；
3. 判断值模拟聚焦样式；
4. 判断值对应的输入框是否已输入值；
5. 当input失去焦点时，需要将模拟输入框也失去焦点。

3. 组件参数配置

1. maxLength 验证码输入长度，默认值为6；
2. focus 表示是否自动聚焦；
3. password 表示输入的值是否是密码类型；
4. type input输入框的type类型，默认为number;
5. className 整体验证码盒子样式；
6. classNameInput 实际输入框的样式；
7. classNameCode 未输入验证码时，输入框的样式&#x