React Native：TextInput toUpperCase 在 onChangeText 中的 Android 上不起作用

Posted 2023-04-18

【中文标题】React Native：TextInput toUpperCase 在 onChangeText 中的 Android 上不起作用

【英文标题】：React Native: TextInput toUpperCase does not work on Android in onChangeText

【发布时间】：2020-04-10 07:28:49

【问题描述】：

我有一个 TextInput 组件，它应该在输入时将输入转换为大写字母。我的代码如下：

import React, Component from 'react';
import  View, StyleSheet, Text, TextInput, Button  from 'react-native';

export default class ProfileTest extends React.Component 

 constructor(props) 
    super(props);
    this.state = text : '';
  

  render() 
    return ( 
     <View>
          <TextInput
            style=fontSize : 60
            onChangeText=text => 
              text = text
                .toUpperCase();
              this.setState( text: text );
            
            value=this.state.text
            placeholder="enter text"
          />

        </View>
    )
  

在世博会上，这确实有效。但是，当我在我的 android 设备上尝试此操作时，我得到以下行为：

前两个字母工作正常，但每当我添加第三个字母时，它会突然重复前两个字母，这样 ABC -> ABABC 我不知道为什么会这样，我似乎无法摆脱它。我已将 '.toUpperCase()' 确定为罪魁祸首。

感谢您的帮助！

【参考方案1】：

您可以在此处找到更多信息： https://github.com/facebook/react-native/issues/23578

1 人对其进行了修复，但仍未投入生产： https://github.com/facebook/react-native/pull/29070

我试图找到一些解决方法，例如改变状态、引用但没有任何效果：/

【参考方案2】：

import React,  useState  from 'react';
import  TextInput, Platform  from 'react-native';

const UselessTextInput = () => 
  const [info, setInfo] = useState('');

  return (
    <TextInput
      style= height: 40, borderColor: 'gray', borderWidth: 1 
      onChangeText=text => 
       setInfo(text.toLowerCase()) 
      
      secureTextEntry=Platform.OS === 'ios' ? false : true
      keyboardType=Platform.OS === 'ios' ? null : 'visible-password'
      value=info
    />
  );


export default UselessTextInput;

【讨论】：

请在此处粘贴您的代码，图像质量很差