archi_kud
@archi_kud
Frontend Developer

Как передать ref родительскому компоненту?

Здравствуйте, читаю в документации про передачу ref из дочернего компонента родительскому с помощью React.forwardRef(), но в примерах используются функции, а мне нужны классы.

Parent.js
import React, { Component } from 'react';
import Child from './Child';

class Parent extends Component {
    render() {
        return (
            <Child />
        )
    }
}


Child.js
import React, { Component } from 'react';

childRef = React.createRef();

export default class Child extends Component {
    render() {
        return (
            <div ref = { this.childRef }></div>
        )
    }
}


Как мне передать ref дочернего элемента родительскому?
  • Вопрос задан
  • 1737 просмотров
Решения вопроса 1
rockon404
@rockon404 Куратор тега React
Frontend Developer
import React, { Component } from 'react';
import Child from './Child';

class Parent extends Component {
  childRef = React.createRef();

  render() {
    return (
      <Child innerRef={this.childRef} />
    );
  }
}


import React, { Component } from 'react';

export default class Child extends Component {
  render() {
    const { innerRef } = this.props;

    return (
      <div ref={innerRef}></div>
    );
  }
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы