antd-mobile Input框无法输入内容的问题
今天做项目的时候用到了antd-mobile中的Input组件,页面效果是出来了,可input中无法输入内容,看了官网上的使用方法也没有发现问题,后来百度了一下才发现问题
这是我目前写法:
const [form,setForm] = useState({account:'',password:''});
<div className={style.loginContain}>
<Input className={style.account} type="text" placeholder='账号' value={form.account} onChange={handleChange('account')} />
<Input className={style.password} type="password" placeholder='密码' value={form.password} onChange={handleChange('password')} />
<div className={style.loginBtn} block color='primary' onClick={()=>handleLogin()}>登录</div>
</div>
这样写一眼看上去感觉没有什么问题,事实上input无法输入内容,原因是因为在antd中 input组件的value属性赋值后,input的值就会一直保持value值,修改后仍然会被重新赋值为value。
解决方案:
1.删除初始值
2.把input中的value修改为defaultValue即可

浙公网安备 33010602011771号