В документах для React указано, что функции компонента могут быть доступны родительским компонентом через refs. См.: https://facebook.github.io/react/tips/expose-component-functions.html
Я пытаюсь использовать это в своем приложении, но при вызове дочерней функции запускается ошибка "undefined is not a function". Мне интересно, не связано ли это с использованием формата ES6 для классов React, потому что я не вижу других различий между моим кодом и документами.
У меня есть компонент Dialog, который выглядит как следующий псевдокод. Диалог имеет кнопку "Сохранить", которая вызывает функцию save(), которая должна вызвать функцию save() в дочернем компоненте Content. Компонент Content собирает информацию из полей дочерней формы и выполняет сохранение.
class MyDialog extends React.Component {
save() {
this.refs.content.save(); <-- save() is undefined
}
render() {
return (
<Dialog action={this.save.bind(this)}>
<Content ref="content"/>
</Dialog>);
}
}
class Content extends React.Component {
save() {
// Get values from child fields
// and save the content
}
}
Вместо этого я мог бы передать prop (saveOnNextUpdate) до Content и затем выполнить сохранение, когда это правда, но я бы предпочел выяснить, как получить описанный выше метод в React doc выше.
Любые идеи о том, как заставить doc-подход работать или обращаться к дочерней компонентной функции по-другому?