13 Ġabra ta 'Data ta' Reazzjoni Iddisinjati Ħafna

Irreaġixxi d-dati

Ikollu a picker tad-data rranġat tajjeb huwa importanti sabiex il-viżitatur ma jaħlix sekonda fl-għażla tad-data tat-twelid jew meta jkun irid jirċievi l-ordni tal-prodott li jkun għadu kemm xtara fl-eCommerce tagħna. Għal din ir-raġuni aħna nġibu 13-il selettur tad-data u l-ħin f'React li huma kkaratterizzati mid-disinn tagħhom u l-esperjenza kbira tal-utent tagħhom.

Dawn is-seletturi huma minn React.js, il- librerija open source Javascript li jippermettilna noħolqu mill-ġdid uħud mill-esperjenzi kbar tagħhom meta jkollna nagħżlu d-data u l-ġurnata speċifika għal avveniment fuq il-websajt li qed inżuru. Ejja nagħmluha mingħajr ma ninsew biex infakkarkom li għandek lista ta 'tab oħra wkoll f'Javascript React.js.

Irreaġixxi selettur multiplu

Irreaġixxi selettur multiplu

Din id-data picker f'React, apparti ikollhom disinn tajjeb, Huwa kkaratterizzat billi jippermetti l-għażla ta 'diversi dati fil-kalendarju li jagħtina. Tista 'ssib id-demo biex tkun taf in situ kif iġib ruħu dan is-selettur React. Hawnhekk għandek postha fiha GitHub.

Irreaġixxi firxa nattiva

Native

Un data picker f'React.js li hija kkaratterizzata mill-faċilità ta 'użu tagħha u kemm hi personalizzabbli. Sempliċi fil-konċepiment tagħha, dan huwa s-suċċess massimu tiegħu biex isir is-selettur tad-data u l-ħin tal-websajt tiegħek.

Dati ta ’Reazzjoni Nattivi

Reazzjoni Nattiva

Dan is-selettur tad-data React isegwi l-istess mudell bħal dawk ta 'qabel biex tikkonverti f'ieħor minn dawk indikati f'din il-lista. Kif ukoll kalendarju, tista 'tagħżel firxa ta' ġranet biex tużaha bħala filtru. Picker ieħor interessanti tad-data React li għandek għad-dispożizzjoni tiegħek.

Picker tad-data RC

Irreaġixxi datetime

Int għandek id-demo ta 'dan id-data RC picker li jkompli juri kwalità kbira bħall-bqija. Wieħed mid-dettalji tiegħu huwa dak toffri l-possibbiltà li tagħżel il-ħin, għalhekk huwa differenti mill-oħrajn f'dan ir-rigward. Esperjenza kbira ta 'l-utent hija interface kbir bħala selettur tad-data u l-ħin f'React.js. Għandek hawn il-Github tiegħek.

Irreaġixxi Kalendarju

Irreaġixxi Kalendarju

Hawnhekk neħilsu kompletament mill-ħin, biex nibqgħu ma 'data picker f'React.js. Huwa simili għal dak ta 'qabel bit-tema ċara, iżda hija distinta billi tidher bħala bar li tista 'tinfetaħ sabiex tagħżel id-data li rridu. Hawn għandek il-Github tiegħek biex tmur fil-kodiċi tas-sors minflok fid-demo.

Selettur tad-data Mobile React

Irreaġixxi mobbli

Dan is-selettur tad-data ddedikat għall-mowbajl minn React.js huwa differenti mill-bqija talli tiżen ftit li xejn. Jispikka għad-disinn tiegħu billi jagħżel l-elementi differenti tad-data permezz ta 'rota diġitali. Int għandek il-Github tiegħek sabiex tkun tista 'tersaq eqreb lejn il-kodiċi tas-sors tagħha u b'hekk timplimentah fuq il-websajt tiegħek.

Kalendarju ta ’Reazzjoni Infinita

Kalendarju infinit

Dan is-selettur tad-data infinit mibni b'React huwa kkaratterizzat minn temi, appoġġ tat-tastiera, għażla tal-firxa u l-post. Wieħed mill-aktar data pickers komprensivi fuq il-lista kollha. Hawn għandek il-Github tiegħek għall-informazzjoni li fadal wara li tkun gawdejt id-demo. Fil-pannell ser ikollok is-serje sħiħa ta 'għażliet biex tipprova kull waħda u b'hekk tieħu idea aħjar tal-possibbiltajiet tagħha.

Irreaġixxi Dati

Irreaġixxi d-dati

A pick picker f'Reatt li huwa distint minn tkun ottimizzata għall-mowbajl u li huwa ppreżentat b'manjieri tajbin ħafna. Għandu wkoll il-Github tiegħek sabiex tkun tista ’tkun taf kull dettall tagħha u b’hekk teħodha fil-websajt tiegħek. Għandek varjetà wiesgħa ta 'għażliet sabiex mid-demo tkun tista' tikkonfiguraha bil-mod tiegħek sabiex tkun tista 'tikseb aktar minnha.

Irreaġixxi selettur nattiv

Reazzjoni mobbli

Nirrakkomandaw li tmur mill-Github tiegħu sabiex tkun taf id-disinn ta 'din id-data picker f'React. Nistgħu niddistingwuh għax uża l-APIs DataPickerAndroid, TimePickerAndroid u DatePicker iOS. Allura l-interfaċċa tagħha tinstema 'familjari għalik jekk int imdorri li tittratta ma' kwalunkwe waħda minn dawk l-OSs għal apparat mobbli. Perfetta biex timplimentah f'applikazzjoni għal waħda miż-żewġ sistemi operattivi msemmija bħal Android u iOS.

Selettur React sempliċi

Reaġiment Sempliċi

Picker tad-data sempliċi ħafna f'React.js li tista 'ssib bosta eżempji ta' użu mill-websajt tad-demo tagħha. Għandna wkoll il-Github tiegħek biex tkun taf il-bqija tad-dettalji ta 'dan is-selettur sempliċi f'Reatt. Ieħor interessanti mhux biss għas-sempliċità tiegħu, iżda għas-suġġett tiegħu għażliet ta 'adattament differenti biex nipprovdu l-websajt tagħna waħda eleganti u sempliċi ħafna.

Mument tal-input

Mument tal-input

Għażla oħra tad-data li magħha tiżdied l-għażla li tagħżel ukoll il-ħin, allura tiġi kompluta. Jaħdem ma 'momentjs u d-disinn ġej mill-istess websajt Dribbble. Żgur li tħobbha għad-disinn tagħha u dik l-eleganti li tagħti lill-websajt fejn hija installata. Dan huwa l-Github tiegħek sabiex ma jonqsu xejn b'eżempju ieħor kbir ta 'dak li hu selettur tad-data u l-ħin.

React day picker

Irreaġixxi l-għażla

Dan is-selettur tad-data f'React huwa kkaratterizzat mid-9KB tiegħu fil-gzipper, apparti li huwa personalizzabbli sew, lokalizzabbli, li jappoġġja l-ARIA u ma jiddependi fuq xejn barra. Lokalizzabbli nfissru li nistgħu nagħżlu l-lingwa tal-kalendarju sabiex tiġi tradotta fil-lingwa tagħna. Ieħor mill-iktar seletturi kompluti ta 'din il-lista React kollha u li jagħmilha diffiċli għalina biex niddeċiedu dwar waħda.

Datepicker ReactJS

Datapicker

Għandek id-demo bħall-bqija biex tkun taf in situ dan is-selettur tad-data li huwa kkaratterizzat minn tool bar li meta tkun ippressata tiftaħ il-kalendarju. Għandu selettur imbagħad jerġa u huwa selettur ta 'kwalità għolja fid-disinn. Huwa minimalista, u għalhekk tista 'tiġi integrata fuq kwalunkwe tip ta 'websajt. Għandek il-Github tiegħu biex issir taf il-bqija tad-dettalji u tuża l-kodiċi kif jogħġbok għall-websajt tiegħek.

Inħalluk b'lista oħra, għalkemm din id-darba ta ’forom fis-CSS sabiex il - jimplimentaw minn issa u għandek repertorju tajjeb biex tagħżel dik il-forma ta 'eleganti għall-websajt tiegħek.


Il-kontenut tal-artikolu jaderixxi mal-prinċipji tagħna ta ' etika editorjali. Biex tirrapporta żball ikklikkja hawn.

Kun l-ewwel li tikkummenta

Ħalli l-kumment tiegħek

Your email address mhux se jkun ippubblikat. oqsma meħtieġa huma mmarkati bl *

*

*

  1. Responsabbli għad-dejta: Miguel Ángel Gatón
  2. Għan tad-dejta: Kontroll SPAM, ġestjoni tal-kummenti.
  3. Leġittimazzjoni: Il-kunsens tiegħek
  4. Komunikazzjoni tad-dejta: Id-dejta ma tiġix ikkomunikata lil partijiet terzi ħlief b'obbligu legali.
  5. Ħażna tad-dejta: Bażi tad-dejta ospitata minn Occentus Networks (UE)
  6. Drittijiet: Fi kwalunkwe ħin tista 'tillimita, tirkupra u tħassar l-informazzjoni tiegħek.