var ListItem = React.createClass({ displayName: "ListItem", getInitialState: function () { return {fruit: this.props.value.product.fruit, meat: this.props.value.product.meat, vegetable: this.props.value.product.vegetable, total: 0 }; }, render: function () { return ( React.createElement("tr", null, React.createElement("td", null, React.createElement("input", { type: "text", name: "fruit", value: this.state.fruit, onChange: this.handleChange, placeholder: "fruit" })), React.createElement("td", null, React.createElement("input", { type: "number", name: "meat", value: this.state.meat, onChange: this.handleChange, placeholder: "..." })), React.createElement("td", null, React.createElement("input", { type: "number", name: "vegetable", value: this.state.vegetable, onChange: this.handleChange, placeholder: "..." })), React.createElement("td", { className: "total" }, this.state.total))); },

Ahora quiero cambiar Fruta, Carne y Verdura a "forma" en lugar de "entrada" con opciones desplegables, de modo que cuando haga clic en Fruta tendré opciones desplegables de "manzana, plátano, fresa". Las opciones de carne serán "cerdo, res, cordero" etc...

he intentado usar

 return React.createElement("select", {}, React.createElement("option", {value: "A"}, "Option A"), React.createElement("option", {value: "B"}, "Option B"), React.createElement("option", {value: "C"}, "Option C") );