Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
React UI with JSX syntax.
class Product extends Component {
render() {
return wp.element.createElement(
"div",
{ className: "product" },
wp.element.createElement(
"p",
null,
this.props.name
)
);
}
}
class ShoppingList extends Component {
render() {
return wp.element.createElement(
"div",
{ className: "shopping-list" },
wp.element.createElement(
"h1",
null,
"Shopping List for ",
this.props.name
),
wp.element.createElement(
"ul",
null,
wp.element.createElement(Product, { name: "Carrot" }),
wp.element.createElement(Product, { name: "Tomato" }),
wp.element.createElement(Product, { name: "Potato" })
)
);
}
}
class Product extends Component {
render() {
return (
<div className="product">
<p>{this.props.name}</p>
</div>
);
}
}
class ShoppingList extends Component {
render() {
return (
<div className="shopping-list">
<h1>Shopping List for {this.props.name}</h1>
<ul>
<Product name="Carrot"/>
<Product name="Tomato"/>
<Product name="Potato"/>
</ul>
</div>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.