Controlled input example

Simple controlled React input. You won't be able to edit the value. author(s): Matt Ruby

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
<div id="mount" class="container" style="margin-top: 40px"></div>

<script src="https://cdn.jsdelivr.net/g/[email protected](react.min.js+react-dom.min.js),[email protected]"></script>
<script src="https://unpkg.com/[email protected]/lib/mobx.umd.min.js"></script>
<script src="https://unpkg.com/[email protected]/index.js"></script>
<script src="https://unpkg.com/mobx-react-devtools"></script>

JavaScript

// Note the Provider and color
var formGroupRenderer = function formGroupRenderer() {
  return React.createElement(
    "form",
    null,
    React.createElement(
      "div",
      { className: "form-group" },
      React.createElement("label", { htmlFor: "emailInput" }, "Email address"),
      React.createElement("input", {
        className: "form-control",
        type: "email",
        name: "email",
        id: "emailInput",
        value: 0
      })
    )
  );
};

ReactDOM.render(
  React.createElement(formGroupRenderer),
  document.getElementById("mount")
);