Question

class HelloWorldComponent extends React.Component {

  render() {
    const person = {"name":"james"};
    return (      
      <input type="text" placeholder="name" value={person.name}>      
    );
  }
}

React.render(
  <HelloWorldComponent />, document.getElementById('react_example')
);

http://jsbin.com/lalomigufo/edit?js,console,output

不确定出现了什么问题，当我尝试在https://babeljs.io

中检查我的代码时出现Unterminated JSX contents错误

Answer 1

输入是一个自我结束标记。你需要添加＆＃34; /＆＃34;在输入元素的末尾：

return (      
  <input type="text" placeholder="name" value={person.name} />      
);

Answer 2

来自facebook的文件：

在HTML中，表单元素如，和通常维护自己的状态并根据用户输入更新它。在React中，可变状态通常保持在状态属性中组件，只用setState（）
更新

因此，您的代码将常量值设置为value属性，这是错误的，此值无法更改，您可以键入任何内容。

React无法渲染，得到Unterminated JSX内容错误

2 个答案: