1.6 KiB
1.6 KiB
title | localeTitle |
---|---|
Pass an Array as Props | Передайте массив как реквизит |
Передайте массив как реквизит
Чтобы передать массив в качестве опоры, сначала массив должен быть объявлен как «задача» для каждого из компонентов, подлежащих визуализации:
const List= (props) => {
return <p></p>
};
class ToDo extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>
<h1>To Do Lists</h1>
<h2>Today</h2>
<List tasks={["Walk", "Cook", "Bake"]} />
<h2>Tomorrow</h2>
<List tasks={["Study", "Code", "Eat"]}/>
</div>
);
}
};
Затем реквизит должен быть обработан внутри компонента «Список»:
const List= (props) => {
return <p>{props.tasks.join(", ")}</p>
};
// ... same as above
Метод .join(", ")
используется для .join(", ")
каждого элемента из массива и объединения его в строку, которая должна отображаться.
В этом примере мы используем модульность React, чтобы отображать задачи, переданные двумя различными компонентами, на общий компонент, который отображает окончательный HTML.