react Input组件输入字符串,失去焦点,需要重新点击获取焦点

出错的伪代码如下:

import { Input } from 'antd'
...
let arr = [1, 2, 3, 4]
...
  return (
    <div>
      {
        arr.map((item) => {
          return ( <Input
          key={Math.random()}
          onChange={(value)=>{
         	console.log(value)
          }}
          />)
        })
      }
    </div>
  )

看似普通,暗含杀机
我有时会使用Math.random()去当作key值,但是更新渲染时,每一次更新都会重新计算key值,这就意味这我们的Input已经不是同一个了,自然就会失去焦点。
最好的办法就是使用对象的id,index也要慎用

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值