我必须创建一些动态引用,以便将焦点集中在Input
自定义组件中包含的内容上。
目前这是我渲染元素的方式:
const countRow = denom => {
this[`${denom.id}-ref`] = React.createRef();
return (
<CountRow
ref={this[`${denom.id}-ref`]}
id={`${denom.name.singular.toLowerCase()}-${denom.id}`}
tenderValue={denom.value}
label={denom.denomination.label}
onChange={(e, value) => this.handleBillsOnChange(e, denom)}
onEnter={() => this.onEnter(denom)}
/>
}
{itterableArray.map(item => countRow(item)}
在我的onEnterFunction
我试图从一个移动<CountRow />
到下一个。
在该函数结束时:
onEnter = denom => {
//some stuff that doesn't matter
this[`${denom.id}-ref`].focus()
}
函数的最后一行onEnter
总是爆炸。说:
TypeError: _this["".concat(...)].focus is not a function
有人可以为我需要做什么来选择特定的焦点提供指导<CountRow />
吗?