logo

Reaktionskort

Et kort er en dataindsamlingstype, hvor data gemmes i form af par. Den indeholder en unik nøgle. Værdien gemt i kortet skal tilknyttes nøglen. Vi kan ikke gemme et dubletpar i kortet(). Det er på grund af hver enkelt gemt nøgles unikke karakter. Det bruges hovedsageligt til hurtig søgning og opsøgning af data.

strengsammenkædning java

I React er ?kortet? metode, der bruges til at krydse og vise en liste over lignende objekter af en komponent. Et kort er ikke træk ved React. I stedet er det standard JavaScript-funktionen, der kan kaldes på ethvert array. Map()-metoden opretter et nyt array ved at kalde en forudsat funktion på hvert element i det kaldende array.

Eksempel

I det givne eksempel tager funktionen map() en matrix af tal og fordobler deres værdier. Vi tildeler det nye array returneret af map() til variablen doubleValue og logger det.

 var numbers = [1, 2, 3, 4, 5]; const doubleValue = numbers.map((number)=>{ return (number * 2); }); console.log(doubleValue); 

I React bruges map() metoden til:

1. Gennemgang af listeelementet.

Eksempel

 import React from &apos;react&apos;; import ReactDOM from &apos;react-dom&apos;; function NameList(props) { const myLists = props.myLists; const listItems = myLists.map((myList) =&gt; <li>{myList}</li> ); return ( <h2>React Map Example</h2> <ul>{listItems}</ul> ); } const myLists = [&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;D&apos;]; ReactDOM.render( , document.getElementById(&apos;app&apos;) ); export default App; 

Produktion

python konvertere bytes til streng
Reaktionskort

2. Gennemgang af listeelementet med taster.

Eksempel

 import React from &apos;react&apos;; import ReactDOM from &apos;react-dom&apos;; function ListItem(props) { return <li>{props.value}</li>; } function NumberList(props) { const numbers = props.numbers; const listItems = numbers.map((number) =&gt; ); return ( <h2>React Map Example</h2> <ul> {listItems} </ul> ); } const numbers = [1, 2, 3, 4, 5]; ReactDOM.render( , document.getElementById(&apos;app&apos;) ); export default App; 

Produktion

Reaktionskort