당신이 알아야 할 23가지 멋진 React Native Forms 라이브러리

블로그

당신이 알아야 할 23가지 멋진 React Native Forms 라이브러리

React 네이티브 선택 선택기

iOS 및 Android에서 동일하게 렌더링하는 사용자 지정 선택 선택기(html의 |_+_|와 동일)








GitHub에서 보기



네이티브 Form4u에 반응

간단하고 가볍고 빠른 React Native 양식 빌더!



  • 간단한 json 파일을 사용하여 필드를 정의합니다. 모든 종류의 반응 네이티브 필드 또는 유효한 구성 요소가 허용됩니다.
  • JavaScript 함수를 사용하여 오류를 반환하는 유연성으로 필드 유효성 검사를 정의하십시오.
  • 양식 제출을 처리하기 위해 고유한 콜백 함수를 정의하십시오.
  • 패키지는 전체 가입 로그인 화면 예제와 함께 제공됩니다.






특징

엘라스토스 구입처
  • 더러운 양식 제출 방지
  • 기본값으로 필드 초기화
  • 날짜/시간, 숫자만, 우편번호, 통화, 브라질 CPF/CNPJ와 같은 가장 일반적인 필드 유형에 대한 기본 마스크 유형
  • react-native-masked-text의 도움으로 사용자 정의 마스크 사용
  • 맞춤형 검증 지원
  • 공통 필드 유형(이메일)에 대한 기본 유효성 검사를 구현합니다.
  • 나만의 양식 스타일 정의
  • 자신의 필드 스타일 정의
  • Nativebase 구성 요소 사용

GitHub에서 보기

엑스포 데이터 양식

redux, graphql 변형 또는 다양한 입력 유형의 API에 데이터를 제출하는 아름다운 양식 만들기
redux, graphql 변형 또는 다양한 입력 유형의 API에 데이터를 제출하는 아름다운 양식을 만듭니다. 이 리포지토리의 목표는 데이터가 모든 유형을 가질 수 있는 모든 변형에서 편집 및 저장 가능한 데이터베이스 데이터를 표시하는 사용자 인터페이스의 API에서 의미론(양식 필드)을 분리하는 것입니다.

GitHub에서 보기

React 네이티브 양식 유효성 검사기

React 네이티브 양식 유효성 검사기는 React Native로 양식 필드의 유효성을 검사하는 간단한 라이브러리입니다. 도서관은 자발적으로 사용하기 쉽습니다. 원하는 React 기본 양식 구성 요소에서 ValidationComponent 클래스를 확장하기만 하면 됩니다.

GitHub에서 보기

반응 교차 양식

ReactJS 앱에 대한 유효성 검사가 포함된 양식!

GitHub에서 보기

네이티브 이미지 선택기 양식에 반응

tcomb-form-native 라이브러리와 함께 사용할 React Native 컴포넌트 팩토리입니다. 현재 react-native-image-crop-picker를 사용하여 이미지 선택을 제공합니다.

GitHub에서 보기

네이티브 체크박스 양식에 반응

react-native-checkbox-form은 간단한 체크박스 구성 요소이며 Android 및 iOS에서 작동합니다. 아이콘은 체크박스 형식에서 사용되며 react-native-vector-icons에 따라 다릅니다.

GitHub에서 보기

Tcomb 폼 네이티브

tcomb-form-native는 메인테이너를 찾고 있습니다. 도움이 되는 데 관심이 있다면 GitHub 문제에 대한 평가를 시작하고 일부 PR을 검토 및 테스트하는 것이 좋은 시작 방법입니다.

GitHub에서 보기

React 네이티브 폼 빌더

고급 기능이 포함된 더 나은 양식 관리 라이브러리를 찾고 있다면 React Reactive Form을 확인하세요.

특징

  • 양식 필드 UI 생성
  • 필드의 상태 및 값 관리, 추적
  • 제출(TextInput) 시 다음 필드에 대한 포커스를 자동으로 관리합니다.
  • 모든 키보드 관련 문제를 현명하게 처리
  • 사용자 정의 유효성 검사 및 중첩 양식 지원
  • Nativebase 구성 요소 사용

GitHub에서 보기

반응형 반응형

React의 반응형과 같은 각도.
Angular의 Reactive Forms에서 영감을 받은 라이브러리로 구성 요소 클래스에서 폼 컨트롤 개체 트리를 만들고 기본 폼 컨트롤 요소와 바인딩할 수 있습니다.

특징

  • UI 독립.
  • 제로 종속성.
  • 중첩된 양식.
  • 컨트롤의 값 및 상태 변경에 대한 구독자입니다.
  • 유효성 검사기 세트를 제공하고 사용자 지정 동기화 및 비동기 검사기를 지원합니다.
  • |_+_| api를 사용하여 더 적은 코드로 큰 양식을 만들 수 있습니다.
  • |_+_|로 더 나은 양식 관리 & |_+_| 아피스.
  • 큰 양식에서 더 나은 성능을 위한 사용자 지정 가능한 업데이트 전략.

GitHub에서 보기

React 네이티브 Instagram 로그인

반응 네이티브 인스타그램 로그인 구성 요소(안드로이드 및 iOS 지원). 풀 리퀘스트를 환영합니다!

GitHub에서 보기

네이티브 고급 양식에 반응

양식 작성 및 관리를 위한 유연한 React Native 아키텍처

특징:

  • 크로스 플랫폼(iOS, Android)
  • 유연한 양식 레이아웃 허용
  • 필드 입력 값을 쉽게 관리 및 검증
  • 더 나은 사용자 경험을 위한 다음 필드의 자동 초점
  • 사용자 정의 구성 요소를 쉽게 통합
  • 구성 요소 기반 - Redux와 함께 또는 없이 사용
  • React Native 0.40+와 호환
  • 프로덕션 앱에서 성공적으로 사용됨

GitHub에서 보기

입력 번호

반응 입력 번호 http://react-component.github.io/input-number/

GitHub에서 보기

리덕스 양식

Redux 저장소에서 양식 상태를 유지하기 위해 react-redux를 사용하는 고차 컴포넌트 https://redux-form.com

GitHub에서 보기

네이티브 영재 양식에 반응

모든 것을 지배하는 하나의 React-Native 양식 구성 요소

GitHub에서 보기

Tcomb 폼 네이티브

tcomb-form-native는 메인테이너를 찾고 있습니다. 도움이 되는 데 관심이 있다면 GitHub 문제에 대한 평가를 시작하고 일부 PR을 검토 및 테스트하는 것이 좋은 시작 방법입니다.

GitHub에서 보기

네이티브 Foect에 반응

React Native를 위한 간단한 양식 유효성 검사 라이브러리.

GitHub에서 보기

네이티브 Formik에 반응

눈물 없이 React에서 양식 빌드 https://jaredpalmer.com/formik

사실, 폼은 React에서 정말 장황합니다. 설상가상으로 대부분의 양식 도우미는 너무 많은 마법을 사용하고 종종 상당한 성능 비용이 수반됩니다. Formik은 가장 성가신 3가지 부분을 도와주는 작은 라이브러리입니다.

양식 상태 안팎에서 값 가져오기
유효성 검사 및 오류 메시지
양식 제출 처리
위의 모든 항목을 한 곳에 배치함으로써 Formik은 양식에 대한 테스트, 리팩토링 및 추론을 쉽게 정리할 수 있도록 합니다.

GitHub에서 보기

네이티브 폼 생성기 반응

특징

  • Android 및 IOS 지원, Yeah Baby!
  • 유쾌한 기본값, 완전히 재정의 가능
  • 종속성이 없음
  • 나만의 아이콘 팩 사용
  • 사용하기 쉽고 깨끗하며 반응하는 스타일 구문
  • 자동 이벤트 처리
  • 이상한 구문을 추가하지 않고 사용자 정의 필드 및 스타일 지원(단지 반응 구성 요소 생성)
  • 기본적으로 현재 OS 스타일을 적용합니다.
  • tcomb에서 영감을 받은 좋은 부품
  • 성능: 변경된 필드만 setState를 얻습니다.
  • 데이터가 포함된 '모델'이나 '구조체'를 만들 필요가 없습니다. 양식 구성 요소를 만들기만 하면 됩니다(React 방식).
  • keyboardType을 기반으로 InputFields 유효성 검사(validationFunction을 사용하여 재정의할 수 있음)
  • 여러 검증인
  • 프로그래밍 방식으로 필드 재설정/설정(setValue, setDate, setTime, focus)
  • Picker 및 DatePicker 구성 요소에 대한 사용자 지정 래퍼(iOS만 해당)

GitHub에서 보기

네이티브 양식에 반응

[Deprecated] React Native를 사용하여 플랫폼 간 기본 표시 형식을 만들기 위한 간단한 선언적 API
나는 이 라이브러리를 2년 전 직장에서의 사용 사례로 작성했는데, React Native가 비교적 젊었을 때였습니다. 나에게 유용했던 코드를 공유하자는 일반적인 정신으로 오픈소스화했지만, 삶의 굴곡이 있는 그대로를 최신 상태로 유지할 기회가 없었고 매우 구식이었습니다. 사용하고 싶다면 가세요! 그러나 직장에서 더 이상 React Native를 사용하지 않기 때문에 이것을 업데이트하거나 기능을 추가할 시간이 없습니다. 하지만 PR을 받고 잠재적으로 리포지토리에 대한 활성 기고자 유지 관리 권한을 부여할 것입니다. 훨씬 더 크고 잘 관리된 프로젝트 내에서 유사한 UI 기능을 보려면 React Native Elements를 확인하는 것이 좋습니다. 다른 더 나은 대안도 많이 있습니다. 들러주셔서 감사합니다!

GitHub에서 보기

네이티브 Fm 양식에 반응

FM Form은 폼이 있는 페이지를 빠르게 생성하기 위한 React Native용 모듈입니다. 백본 양식처럼 작동합니다. 이 모듈을 사용하면 5분 안에 페이지를 생성할 수 있습니다!

현재 iOS만 지원합니다!!!

게으른 탓에 이 모듈을 만들었습니다... 이 프로젝트의 원래 목적은 앱을 더 빨리 개발하는 것입니다. 버그와 디자인 문제가 많다고 생각합니다. 이 프로젝트에 관심이 있다면 개선할 수 있도록 도와주세요!

GitHub에서 보기

네이티브 클린 폼에 반응

redux-form+immutablejs 통합과 함께 부트스트랩과 같은 구문을 사용하는 쉬운 반응 네이티브 양식. styled-components를 사용하여 스타일 지정 http://esbenp.github.io/2017/01/06/react-native-redux-form-immutable-styled-components/

GitHub에서 보기

#react-native #react #모바일 앱