Реагировать получить все дети рефери

Question

У меня есть компонент, который отображает динамических потомков, каждому из этих детей должен быть назначен реф, например ref={'childID' + index}

как только дети загрузятся, мне нужен способ перебрать детей и получить их ссылки.

Есть ли способ сделать это?

Answer 1

Вы должны быть в состоянии пройти через this.refs использование объекта Object.keys,

Object.keys(this.refs).forEach(key =>
  const ref = this.refs[key];
  ...
);

Answer 2

Вы можете использовать стиль обратного вызова для ref Проп, чтобы собрать все ссылки.

Вот грубый пример того, как это будет выглядеть.

var refs = {};

function refCollector(id) {
  return function(element) {
    refs[id] = element;

    if(allRefsCollected()) {
      // do some work with all refs
    }
  }
}

function allRefsCollected() {
  return Object.keys(refs).length >= children.length;
}

return children.map((Child, index) => {
  return <Child ref={refCollector(index)} />;
});

когда allRefsCollected возвращает true, вы будете знать, что все дети были оказаны и refs будет объект, отображение id в element,