如何在没有TestUtils.findAllInRenderedTree的情况下遍历所有React组件，包括DOM组件？

Question

React v0.14将不再能够通过TestUtils.findAllInRenderedTree遍历根组件内的所有渲染组件 - 将排除DOM组件。

是否有更好的做法通过根组件内的所有组件？

Answer 1

您可以通过遍历子节点来递归遍历节点。

function traverse(node, visitor){
  return _traverse(node, visitor, {level: 0, parent: null});
}

function _traverse(node, visitor, state){
  visitor(node, state);

  if (!node.props) return;
  var children = React.Children.toArray(node.props.children);

  children.forEach((child) => _traverse(child, visitor, {
    level: state.level + 1, parent: node
  }));
}

此处an example。

您可以将该功能修改为地图或过滤器，而不是forEach。

作为一般规则，除了单元测试或元编程之外，做这样的事情是一种反模式。