23 Awesome React Native Forms Libraries ที่คุณควรรู้
React Native Select Picker
ตัวเลือกการเลือกที่กำหนดเอง (เช่นเดียวกับ |_+_| ใน html) ที่แสดงเหมือนกันบน iOS และ Android
ตอบสนอง Native Form4u
ตัวสร้างรูปแบบ React Native ง่าย เบา และรวดเร็ว !
- กำหนดฟิลด์โดยใช้ไฟล์ json อย่างง่าย ยอมรับฟิลด์ react-native หรือส่วนประกอบที่ถูกต้องทุกประเภท
- กำหนดการตรวจสอบฟิลด์ด้วยความยืดหยุ่นของการใช้ฟังก์ชัน JavaScript เพื่อส่งคืนข้อผิดพลาด
- กำหนดฟังก์ชันเรียกกลับของคุณเองเพื่อจัดการกับการส่งแบบฟอร์ม
- แพ็คเกจมาพร้อมกับตัวอย่างหน้าจอเข้าสู่ระบบการลงชื่อสมัครใช้แบบเต็ม
คุณสมบัติ
คอนฟลักซ์ (cfx)
- ป้องกันการส่งแบบฟอร์มสกปรก
- เริ่มต้นฟิลด์ด้วยค่าเริ่มต้น
- ประเภทมาสก์เริ่มต้นสำหรับประเภทฟิลด์ทั่วไปส่วนใหญ่ เช่น วันที่เวลา ตัวเลขเท่านั้น รหัสไปรษณีย์ สกุลเงิน CPF/CNPJ ของบราซิล
- ใช้มาสก์ที่กำหนดเองด้วยความช่วยเหลือของ react-native-masked-text
- รองรับการตรวจสอบความถูกต้อง
- ใช้การตรวจสอบเริ่มต้นสำหรับประเภทฟิลด์ทั่วไป (อีเมล)
- กำหนดรูปแบบแบบฟอร์มของคุณเอง
- กำหนดรูปแบบสนามของคุณเอง
- ใช้ส่วนประกอบ Nativebase
แบบฟอร์มข้อมูลงานเอ็กซ์โป
สร้างรูปแบบที่สวยงามที่ส่งข้อมูลไปยัง redux, การกลายพันธุ์ของ graphql หรือ api ในประเภทอินพุตต่างๆ มากมาย
สร้างรูปแบบที่สวยงามที่ส่งข้อมูลไปยัง redux, การกลายพันธุ์ของ graphql หรือ api ในประเภทอินพุตต่างๆ มากมาย เป้าหมายของการซื้อคืนนี้คือการแยกความหมาย (ฟิลด์แบบฟอร์ม) ออกจาก API จากอินเทอร์เฟซผู้ใช้ของการแสดงข้อมูลฐานข้อมูลที่แก้ไขและบันทึกได้จากการกลายพันธุ์ใดๆ โดยที่ข้อมูลสามารถมีได้ทุกประเภท
React Native Form Validator
โปรแกรมตรวจสอบแบบฟอร์มเนทีฟของ React เป็นไลบรารี่ง่าย ๆ ในการตรวจสอบฟิลด์แบบฟอร์มของคุณด้วย React Native ห้องสมุดใช้งานง่ายโดยสมัครใจ คุณเพียงแค่ต้องขยายคลาส ValidationComponent บนส่วนประกอบฟอร์มดั้งเดิมของ React ที่คุณต้องการ
ปฏิกิริยาข้ามแบบฟอร์ม
แบบฟอร์มที่มีการตรวจสอบสำหรับแอป ReactJS ของคุณ!
ตอบสนองรูปแบบตัวเลือกรูปภาพดั้งเดิม
โรงงานส่วนประกอบ React Native เพื่อใช้กับไลบรารี tcomb-form-native ขณะนี้ใช้ react-native-image-crop-picker เพื่อให้การเลือกรูปภาพ
ตอบสนองแบบฟอร์มช่องทำเครื่องหมายดั้งเดิม
react-native-checkbox-form เป็นส่วนประกอบของช่องทำเครื่องหมายอย่างง่าย มันทำงานบน Android และ iOS ไอคอนถูกใช้ในรูปแบบช่องทำเครื่องหมายขึ้นอยู่กับ react-native-vector-icons
Tcomb แบบฟอร์ม Native
tcomb-form-native กำลังมองหา ผู้ดูแล หากคุณสนใจที่จะช่วยเหลือ วิธีที่ดีในการเริ่มต้นก็คือการเริ่มชั่งน้ำหนักปัญหา GitHub ทบทวนและทดสอบ PR บางส่วน
React Native Form Builder
หากคุณกำลังมองหาไลบรารีการจัดการฟอร์มที่ดีกว่าพร้อมคุณสมบัติขั้นสูง โปรดดู React Reactive Form
คุณสมบัติ
- สร้างฟิลด์ฟอร์ม UI
- จัดการ ติดตามสถานะ & ค่าของฟิลด์
- จัดการโฟกัสไปยังฟิลด์ถัดไปในการส่งโดยอัตโนมัติ (TextInput)
- จัดการปัญหาคีย์บอร์ดทั้งหมดอย่างชาญฉลาด
- รองรับการตรวจสอบและแบบฟอร์มที่ซ้อนกัน
- ใช้ส่วนประกอบ Nativebase
ปฏิกิริยารูปแบบปฏิกิริยา
รูปแบบเชิงมุมเหมือนปฏิกิริยาใน React
เป็นไลบรารีที่ได้รับแรงบันดาลใจจาก Angular's Reactive Forms ซึ่งช่วยให้สามารถสร้างทรีของออบเจ็กต์การควบคุมฟอร์มในคลาสคอมโพเนนต์และผูกไว้กับองค์ประกอบการควบคุมฟอร์มแบบเนทีฟ
คุณสมบัติ
- UI อิสระ
- การพึ่งพาศูนย์
- แบบฟอร์มที่ซ้อนกัน
- สมาชิกสำหรับการเปลี่ยนแปลงค่าและสถานะของการควบคุม
- จัดเตรียมชุดเครื่องมือตรวจสอบและรองรับตัวตรวจสอบการซิงค์และซิงค์แบบกำหนดเอง
- |_+_| api เพื่อสร้างฟอร์มขนาดใหญ่ที่มีโค้ดน้อย
- การจัดการรูปแบบที่ดีขึ้นด้วย |_+_| & |_+_| apis
- กลยุทธ์การอัพเดทที่ปรับแต่งได้เพื่อประสิทธิภาพที่ดีขึ้นด้วยฟอร์มขนาดใหญ่
ตอบโต้การเข้าสู่ระบบ Instagram ดั้งเดิม
องค์ประกอบการเข้าสู่ระบบ instagram แบบโต้ตอบ (รองรับ android & ios) ยินดีต้อนรับคำขอดึง!
ตอบสนองแบบฟอร์มขั้นสูงของ Native
สถาปัตยกรรม React Native ที่ยืดหยุ่นสำหรับการสร้างและจัดการแบบฟอร์ม
คุณสมบัติ:
- ข้ามแพลตฟอร์ม (iOS, Android)
- อนุญาตให้ใช้รูปแบบที่ยืดหยุ่นได้
- จัดการและตรวจสอบค่าอินพุตฟิลด์ได้อย่างง่ายดาย
- การโฟกัสอัตโนมัติของฟิลด์ถัดไปเพื่อประสบการณ์การใช้งานที่ดียิ่งขึ้น
- รวมส่วนประกอบที่คุณกำหนดเองได้อย่างง่ายดาย
- แบบอิงส่วนประกอบ - ใช้กับหรือไม่มี Redux
- เข้ากันได้กับ React Native 0.40+
- ใช้สำเร็จในแอปที่ใช้งานจริง
ใส่หมายเลข
ตอบสนองหมายเลขอินพุต http://react-component.github.io/input-number/
แบบฟอร์ม Redux
ส่วนประกอบการสั่งซื้อที่สูงขึ้นโดยใช้ react-redux เพื่อรักษาสถานะของฟอร์มใน Redux store https://redux-form.com
ตอบสนองแบบฟอร์มพรสวรรค์ของชนพื้นเมือง
ส่วนประกอบแบบฟอร์ม React-Native หนึ่งชุดเพื่อควบคุมทั้งหมด
Tcomb แบบฟอร์ม Native
tcomb-form-native กำลังมองหา ผู้ดูแล หากคุณสนใจที่จะช่วยเหลือ วิธีที่ดีในการเริ่มต้นก็คือการเริ่มชั่งน้ำหนักปัญหา GitHub ทบทวนและทดสอบ PR บางส่วน
ตอบโต้ Native Foect
ไลบรารีตรวจสอบฟอร์มอย่างง่ายสำหรับ React Native
ตอบโต้ Native Formik
สร้างรูปแบบใน React โดยไม่ต้องเสียน้ำตา https://jaredpalmer.com/formik
มาเผชิญหน้ากัน แบบฟอร์มนั้นละเอียดมากใน React ที่เลวร้ายกว่านั้น ผู้ช่วยแบบฟอร์มส่วนใหญ่ใช้เวทมนตร์มากเกินไป และมักมีค่าใช้จ่ายด้านประสิทธิภาพที่เกี่ยวข้องกับพวกเขาอย่างมาก Formik เป็นห้องสมุดขนาดเล็กที่ช่วยให้คุณมี 3 ส่วนที่น่ารำคาญที่สุด:
รับค่าเข้าและออกจากสถานะแบบฟอร์ม
การตรวจสอบและข้อความแสดงข้อผิดพลาด
การจัดการกับการส่งแบบฟอร์ม
การจัดองค์ประกอบทั้งหมดข้างต้นไว้ในที่เดียว Formik จะจัดระเบียบสิ่งต่างๆ ทำให้การทดสอบ การจัดโครงสร้างใหม่ และการให้เหตุผลเกี่ยวกับแบบฟอร์มของคุณเป็นเรื่องง่าย
React Native Form Generator
คุณสมบัติ
- รองรับ Android และ IOS ใช่แล้วที่รัก!
- ค่าเริ่มต้นที่น่าพอใจ ลบล้างได้โดยสิ้นเชิง
- ไม่มีการพึ่งพา
- ใช้ชุดไอคอนของคุณเอง
- ใช้งานง่ายและสะอาด ตอบสนองรูปแบบไวยากรณ์
- การจัดการเหตุการณ์อัตโนมัติ
- รองรับฟิลด์และสไตล์ที่กำหนดเองโดยไม่ต้องเพิ่มไวยากรณ์แปลก ๆ (เพียงแค่สร้างองค์ประกอบตอบโต้)
- ใช้โดยค่าเริ่มต้นสไตล์ระบบปฏิบัติการปัจจุบัน
- แรงบันดาลใจจาก tcomb ส่วนที่ดี
- การแสดง: เพียงแค่เปลี่ยนฟิลด์จะได้รับ setState
- คุณไม่จำเป็นต้องสร้าง 'แบบจำลอง' หรือ 'โครงสร้าง' ที่มีข้อมูลของคุณ เพียงแค่สร้างองค์ประกอบแบบฟอร์ม (วิธีการของ React)
- ตรวจสอบ InputFields ตามประเภทแป้นพิมพ์ (สามารถแทนที่ได้โดยใช้ validationFunction)
- เครื่องมือตรวจสอบหลายตัว
- รีเซ็ต/ตั้งค่าฟิลด์โดยทางโปรแกรม (setValue, setDate, setTime, โฟกัส)
- Wrapper แบบกำหนดเองสำหรับส่วนประกอบ Picker & DatePicker (iOS เท่านั้น)
ตอบสนองแบบฟอร์มดั้งเดิม
[เลิกใช้แล้ว] API ที่เปิดเผยและเรียบง่ายสำหรับการสร้างแบบฟอร์มข้ามแพลตฟอร์มและปรากฏแบบเนทีฟด้วย React Native
ฉันเขียนห้องสมุดนี้เมื่อสองปีที่แล้วเพื่อใช้ในกรณีการใช้งานในที่ทำงาน เมื่อ React Native ยังอายุน้อย ฉันเปิดซอร์สโค้ดด้วยจิตวิญญาณทั่วไปของการแชร์โค้ดที่เป็นประโยชน์กับฉัน แต่ด้วยความผันผวนของชีวิต ฉันไม่มีโอกาสที่จะทำให้มันทันสมัยอยู่เสมอ และมันก็กลายเป็นสิ่งที่ล้าสมัยไปแล้ว ถ้าอยากใช้ก็ลุยเลย! แต่เนื่องจากฉันไม่ได้ใช้ React Native ในที่ทำงานอีกต่อไป ฉันจึงไม่มีเวลาอัปเดตหรือเพิ่มคุณลักษณะนี้ แม้ว่าฉันจะรับการประชาสัมพันธ์และอาจให้สิทธิ์ในการบำรุงรักษาผู้สนับสนุนที่ใช้งานอยู่ใน repo หากพบว่ามีประโยชน์ในการทำงานต่อไป สำหรับฟังก์ชัน UI ที่คล้ายคลึงกันภายในโปรเจ็กต์ที่ใหญ่กว่าและได้รับการดูแลที่ดีกว่ามาก ฉันขอแนะนำให้ตรวจสอบ React Native Elements มีทางเลือกอื่นที่ดีกว่ามากมายเช่นกัน ขอบคุณสำหรับการหยุดโดย!
ตอบสนองแบบฟอร์ม Fm ดั้งเดิม
แบบฟอร์ม FM เป็นโมดูลสำหรับ React Native เพื่อสร้างหน้าด้วยแบบฟอร์มอย่างรวดเร็ว มันทำงานเหมือนรูปแบบกระดูกสันหลัง การใช้โมดูลนี้คุณสามารถสร้างเพจได้ภายใน 5 นาที!
ปัจจุบันรองรับเฉพาะ iOS !!!
ฉันสร้างโมดูลนี้เพราะฉันขี้เกียจ… จุดประสงค์ดั้งเดิมของโครงการนี้คือเพื่อให้ฉันพัฒนาแอปได้เร็วขึ้น ฉันเชื่อว่ามีข้อบกพร่องและปัญหาการออกแบบมากมาย หากคุณสนใจในโครงการนี้โปรดช่วยฉันปรับปรุง!
ตอบสนอง Native Clean Form
รูปแบบ react-native อย่างง่ายโดยใช้ไวยากรณ์ที่เหมือน bootstrap พร้อมการรวม redux-form+immutablejs จัดแต่งทรงผมโดยใช้องค์ประกอบที่มีสไตล์ http://esbenp.github.io/2017/01/06/react-native-redux-form-immutable-styled-components/
#react-native #react #mobile-apps
ดูสิ่งนี้ด้วย:
- ไลบรารีเพื่อทดสอบประสิทธิภาพรันไทม์ใน React
- Dark Mode Instagram Clone ด้วย React-Native
- ตัวจัดการคำสั่ง Discord Slash อย่างง่ายสำหรับ discord.py
- ความรู้เบื้องต้นเกี่ยวกับอัลกอริทึม รุ่นที่สี่ Kindle Edition (หนังสือ PDF สำหรับการดาวน์โหลดฟรี)
- ซื้อ NewYorkCoin (NYC) ได้อย่างไรและที่ไหน – คำแนะนำทีละขั้นตอนง่าย ๆ