从数组创建的React refs不起作用

是因为React中的ref属性需要使用回调函数的形式来创建，而不是直接使用数组的方式。

当我们使用数组创建React refs时，我们可能会遇到无法访问到所创建的refs的问题。这是因为在React的渲染过程中，数组的每个元素都会被当作单独的子元素进行处理，而不会被作为整个数组的元素来处理。这就导致了无法正确地创建和访问refs的问题。

为了解决这个问题，我们需要使用回调函数来创建refs。具体而言，我们可以在需要创建ref的元素上使用ref属性，并将一个回调函数作为其值。当组件挂载完成时，React会自动调用这个回调函数，并将对应的DOM元素或组件实例作为参数传递给它。我们可以在回调函数中将这个参数保存起来，以便后续使用。

以下是一个示例代码：

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRefs = [];
  }

  handleRef = (ref) => {
    this.myRefs.push(ref);
  }

  render() {
    return (
      <div>
        {Array.from({ length: 5 }).map((_, index) => (
          <div key={index} ref={this.handleRef}>
            Element {index}
          </div>
        ))}
      </div>
    );
  }
}

在上面的示例中，我们通过回调函数handleRef将创建的ref保存在this.myRefs数组中。这样，我们就可以在组件的其他方法中访问到这些ref了。

需要注意的是，在使用这种方式创建refs时，我们无法像使用对象形式的refs那样直接通过引用来访问到对应的元素或组件。相反，我们需要通过数组索引来获取相应的ref，例如this.myRefs[0]。这一点需要在代码中进行相应的处理。

总结起来，当使用数组创建React refs时，需要使用回调函数的形式来创建并保存refs，以确保可以正确地访问到它们。在之后的使用过程中，可以通过索引来获取对应的ref，进行相应的操作。