React.js onChange <input>标签挂起
React.js onChange <input>标签挂起
提问于 2021-02-04 11:17:36
因为我想通过输入标签获取名字。每当我尝试输入一些值，只有一个字母是类型，然后输入框进入其理想的位置。是挂着还是卡住了，我真的不明白。我清楚这段代码是在我的另一个项目中工作的，所以它真的很奇怪。
const [name, setName] = useState('')
<input type='text' placeholder='Name' class='inputColor width90' name='n'
onChange={(e)=>{
setName(e.target.value)
}}
required/>下面是上面代码的css
.inputColor{
padding: 5px;
margin: 10px;
border: 0px solid;
background-color: #F0F0F0;
color: #000000;
font-size: 18px;
outline: none;
height: 35px;
}
.width90{
width: 90%;
}但是，当我在不使用onChange函数的情况下运行代码时，输入框不会卡住或挂起。我检查语法很多次，但我不知道为什么会发生这种情况。
希望有人能给我最好的解决办法。
回答 2
Stack Overflow用户
发布于 2021-02-04 11:22:58
您需要添加value={name}
<input
type='text'
placeholder='Name'
class='inputColor width90'
name='n'
value={name}
onChange={(e)=> {
setName(e.target.value)
}}
required
/>原因是如果您有一个onChange，这意味着您要动态地设置值，这就是为什么您需要将value设置为name的值
Stack Overflow用户
发布于 2021-02-04 21:23:35
在这里，我发现了实际的原因或我们对它说的任何话，我们无法识别它，因为它没有在控制台上显示任何错误，并成功地编译了程序。
const MyFunc = () => {
const [name, setName] = useState('')
const submitData = () => {
Axios.post('http://localhost:3001/api/upload',{
n: name
}
}
return (
<div class='myCSS'>
<table>
<tr>
<td>
<img src={myimg} alt={myimg}/>
</td><td>
<input type='text' name='n' placeholder='Name'
class='inputColor width90'
onChange={(e)=>{setName(e.target.value)}}
required/>
</td><td>
<input type='submit' value='upload'
onClick={submitData}/>
</td>
</tr>
</table>
</div>
)
}因此，首先我定义了name变量和MyFunc外部的submitData，但是当我在函数中同时定义这两个变量时，挂起或卡住错误就解决了。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/66052369
复制相关文章
点击加载更多
相似问题
回到AppDelegate
如何将AppDelegate类添加到AppDelegate.cs中？
无法将BOOL设置为yes
NSUserDefaults registerDefaults to set initial BOOL - BOOL值的存在是否返回YES
设置BOOL类型的默认值为YES
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
