Получение узла DOM из дочернего элемента React без ReactDOM.findDOMNode
Мне интересно, как я могу найти узел DOM дочернего элемента React. Этот вопрос задавался раньше, однако в каждом решении, которое я могу найти (например, Вот этот), в принятом ответе используется ReactDOM.findDOMNode. Я не считаю это идеальным решением, поскольку использование ReactDOM.findDOMNode не рекомендуется, и это может быть устарело в будущем.
Если вы рассмотрели возможность создания новой ссылки с React.createRef() из cloneElement, но, похоже, это не обеспечивает способ доступа к getBoundingClientRect(), который мне нужен.
т.е.
// in constructor
this.childElement = React.createRef();
...
const newChild = React.cloneElement(
childElement,
{ ref: this.childElement }
);
Есть ли способ сделать это без ReactDOM.findDOMNode?
В моем случае да. У меня есть компонент-оболочка, который должен иметь возможность назначать ссылку любому компоненту или элементу, переданному как props.children.
Можете ли вы перебрать потомков и назначить каждому ссылку?
В моем случае оболочка должна всегда принимать только одного дочернего элемента, поэтому я использую const childElement = React.Children.only(this.props.children);. Как показано выше, этот элемент клонирован, и я пытаюсь назначить ссылку (но, очевидно, узел не работает должным образом, поскольку я не могу вызвать getBoundingClientRect. ). Это должно фактически быть таким же, как итерация и назначение ссылок.
Что-то не так с получением DOM-узла дочернего элемента, например, через
<div ref = {node => this.node = node} />?