标签：edit inputName 复用 Antd key input 组件 Input

在使用antd中的Input组件时，点击修改后，再点击新增，input组件的默认值不变。找了很久，才知道这是用于input组件的复用导致的。

1.问题

当然，如果你将input中的值保存在函数组件的useState或者类组件的state中，应该不会出现这些问题。不过那样每次输入时会频繁render。不太推荐这样做。

我们只需要用一个变量暂时保存一下就可以。

2.解决

给input标签加上key值，渲染时区分是不同的input组件就可以了。

<Input placeholder="请输入角色名称" disabled={ false }
onChange={ (e) => { edit.inputName = e.target.value } } 
className="input-size" defaultValue={ edit.inputName } 
key={ edit.isAdd ? "addKey" : "updateKey" }></Input>

标签：edit,inputName,复用,Antd,key,input,组件,Input
来源： https://blog.csdn.net/qq_41339126/article/details/120527110

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。