访问生成列表的项目

Question

我想访问生成的组件列表的第一项。

例如，在此CodePen中，我要触发对预设列表的第一项的单击，因此其他组件将根据新值进行更新。

我想我需要在useEffect和/或useRef之间混合使用，但是我对这些概念还不太满意。

Answer 1

我设法通过使用ref回调触发了对第一个预设的点击。 这意味着无线电输入具有指向以下回调的ref={refCallback}属性。 我不确定这是否是我想要做的最好方法，欢迎其他答案。

const refCallback = React.useCallback(node => {
  if (node && node.value === presets[0].id) {
    node.click();
  }
}, [presets]);

这是更新后的CodePen。