[ReactNative] TextInput 입력한 첫 글자 대문자 자동변경 막는 방법

autoCapitalize​

autoCapitalize​는 특정 문자가 자동으로 대문자로 표시되도록 TextInput에 지시합니다. 

이 속성은 name-phone-pad와 같은 일부 키보드 유형에서 지원되지 않습니다.

  • characters : 모든 문자
  • words : 각 단어의 첫 글자
  • sentences : 각 문장의 첫 글자(기본값)
  • none : 아무 것도 자동으로 대문자로 표시하지 않습니다.

만약 TextInput에 입력한 첫글자가 대문자로 자동 변경되는 걸 막고 싶다면 autoCapitalize 속성에 'none'을 입력하면 됩니다.

autoCapitalize="none"

 

예시

다음은 autoCapitalize가 'none'으로 설정된 React Native의 TextInput 컴포넌트를 만든 간단한 예입니다.

import React, { useState } from 'react';
import { View, TextInput } from 'react-native';

const MyInput = () => {
  const [text, setText] = useState('');

  const onChangeText = (inputText) => {
    setText(inputText);
  };

  return (
    <View>
      <TextInput
        onChangeText={onChangeText}
        value={text}
        placeholder="아무거나 입력하세요..."
        autoCapitalize="none" //첫글자 대문자 자동변환 비활성화
      />
    </View>
  );
}

export default MyInput;