React Native 0.79.4中TextInput输入抖动问题求助
React Native 0.79.4中TextInput输入抖动问题求助
大家好,我在使用React Native 0.79.4开发时遇到了一个头疼的问题:每当我输入不符合规则的数字时,输入框会出现抖动现象——输入的字符先显示出来,瞬间又被移除。而且哪怕是用空的onChangeText={() => {}}也会出现这个情况,想问问有没有人遇到过类似问题或者找到了解决方案?
以下是我的相关代码:
手机号输入处理回调
const handlePhoneNumberChange = useCallback((text: string) => { // 只允许输入数字 let numericText = text.replace(/[^0-9]/g, ''); // 移除+91或91前缀(仅当存在且长度超过10时) if (numericText.startsWith('91') && numericText.length > 10) { numericText = numericText.substring(2); } // 移除以0-5开头的数字(印度手机号无效前缀) if (numericText.length > 0 && /^[0-5]/.test(numericText)) { numericText = numericText.substring(1); } // 限制最多10个字符 if (numericText.length > 10) { numericText = numericText.substring(0, 10); } setPhoneNumber(numericText); }, []);
TextInput组件代码
<View className="mb-6"> <View className="flex-row items-center border border-gray-300 overflow-hidden py-1"> <TextInput style={{ fontSize: 24, color: 'black', fontWeight: 'bold'}} placeholderTextColor="#F0F3F5" placeholder="0000000000" keyboardType="phone-pad" value={phoneNumber} onChangeText={handlePhoneNumberChange} autoFocus={!showOtpInputs} maxLength={14} /> </View> </View>
我本来是想实现印度手机号的输入校验逻辑,但现在这个输入抖动的问题严重影响了用户体验。哪怕我简化onChangeText的逻辑,甚至用空函数,这个问题依然存在,所以怀疑是不是RN 0.79.4版本本身的TextInput问题?有没有人知道修复方法,或者有没有社区发布的相关补丁可以用?
内容来源于stack exchange
相关产品推荐
相关产品推荐

