I have a generic ListComponent function
function ListComponent() {
return React.createElement(
"ul",
{ className: "list" },
items.map((item, i) => React.createElement("li", {key: i}, item))
);
}
Now I want to pass an array to that component as props and render it:
const vacations = ["Spain", "Greece", "Vietnam"];
const VacationsList = React.createElement(ListComponent, {items: vacations}, null);
ReactDOM.render(VacationsList, document.getElementById("root"));
I am getting the ReferenceError "items is not defined". How can I fix this?
>Solution :
You have to recieve the items like
function ListComponent({ items }) {
return React.createElement(
"ul",
{ className: "list" },
items.map((item, i) => React.createElement("li", {key: i}, item))
);
}