我无法用useState钩子管理类似类型的第二个组件的状态。
name1正在工作，name2没有更新。如何让name2像name1一样更新?我错过了什么?
将感谢你在理解概念方面的帮助:)
<body>
<div id="root"></div>
<script src="https://unpkg.com/react@16.12.0/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16.12.0/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone@7.8.3/babel.js"></script>
<script type="text/babel">
function Greeting () {
const [name, setName] = React.useState('')
const [name2, setName2] = React.useState('')
const handleChange = event => setName(event.target.value)
const handleChange2 = event => setName2(event.target.value)
return (
<div>
<form>
<label htmlFor='name'>Name: </label>
<input onChange={handleChange} id='name' />
</form>
{name ? <strong>Hello {name}</strong> : 'Please type your name'}
<div>
<form>
<label htmlFor='name'>Name: </label>
<input onChange='{handleChange2}' id='name' />
</form>
{name2 ? <strong>Hello {name2}</strong> : 'Please type your name'}
</div>
</div>
)
}
ReactDOM.render(<Greeting />, document.getElementById('root'))
</script>
</body>
您刚刚用':
包装了处理程序。<input onChange='{handleChange2}' id='name' />
删掉就好了