일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
- 자바스크립트 문제
- HTML
- JavaScript
- 자바스크립트 문제풀이
- leetcode문제풀이
- 자바스크립트 알고리즘 문제
- Next.js13
- til
- 자바스크립트 문제 풀이
- next13
- Baekjoon
- 자바스크립트 연결리스트
- 리액트쿼리
- CSS
- 자바스크립트
- 알고리즘문제풀이
- 자바스크립트코딩테스트
- 리액트
- 프론트엔드
- 프로그래머스
- lodash
- stack문제
- leetcode
- 제로베이스
- 자바스크립트 알고리즘
- react
- Next
- JS
- 타입스크립트
- NPM
- Today
- Total
코드노트
리액트 네이티브 TextInput 기능 정리, RN 본문
현제 사이드프로젝트로 간단한 앱을 만들면서 TextInput으로 회원가입, 로그인을 구현하였다.
기능들이 기존 html input태그와 많이 달랐고 사용할 수 있는 속성들도 많았던거 같다.
pwa도 진행을 해봤지만 역시 일반적으로 리액트로 진행하는것보다 네이티브가 좋은것 같다...
리액트 네이티브를 하면서 느낀거지면 모바일에 최적화되어있는것도 있지만
기본적으로 제공하는 속성들만 잘 활용하더라도 간단한 앱에서 사용하는것들은 구현하기가 쉬울것 같은 느낌..!
onChangeText: 텍스트가 변경될 때마다 호출되는 함수를 설정
placeholder: 입력 필드에 표시되는 텍스트를 설정
placeholderTextColor: placeholder 텍스트의 색상을 설정
editable: 사용자가 텍스트를 입력할 수 있는지 여부를 설정
keyboardType: 키보드 유형을 설정합니다 (예: default, email-address, numeric).
autoCapitalize: 자동 대문자 치환 기능을 설정 (예: none, sentences, words, characters).
autoCorrect: 자동 수정 기능을 설정
spellCheck: 맞춤법 검사 기능을 설정
secureTextEntry: 비밀번호 입력 필드처럼 텍스트를 마스킹
maxLength: 입력 가능한 최대 문자 수를 설정
multiline: 여러 줄 입력을 허용
numberOfLines: 표시되는 최대 행 수를 설정
selectionColor: 선택된 텍스트의 배경색을 설정
clearTextOnFocus: 포커스가 있을때 텍스트 지움
returnKeyType: 엔터키 클릭 시 수행 작업 ( 키보드에 확인란에 보여지는 텍스트 ) (예: done, go, next, search 등)
이 외에도 다양한 기능들이 있고 세세하게 설정을 한다면 좋은 ux를 보여줄 수 있을것 같다!
'Code note > 리액트' 카테고리의 다른 글
리액트 네이티브 절대 경로 지정 Feat. babel (0) | 2024.04.20 |
---|---|
ref 여러개 하나의 ref로 관리, mergeRefs 함수 정리, feat, ForwardedRef (0) | 2024.04.18 |
리액트쿼리를 쓴다면 이건 꼭 알고 쓰자 (0) | 2024.03.20 |
리액트 가상돔 Virtual DOM 정리 (0) | 2023.08.04 |
리액트 createPortal로 DOM추가하기 (0) | 2023.08.01 |