Из React docs (курсив мой):Почему возможно иногда привязывать ref к функции без гражданства?
Refs не может быть присоединен к безгосударственного функции, потому что компонент не имеет резервное экземпляр. Вы всегда можете обернуть компонент без состояния в стандартном составном компоненте и присоединить ref к составному компоненту.
И 0.14 changelog (курсив мой):
Поскольку ни один экземпляр компонента не создается для функционального компонента, любой исх добавил к одному оценит обнулить. Функциональные компоненты не имеют методов жизненного цикла, но вы можете установить .propTypes и .defaultProps как свойства функции.
В лекции 21 Dan Абрамова Redux egghead tutorials мы пишем следующее лица без функционального компонента для добавления TODO:
const AddTodo = ({
onAddClick,
}) => {
let input;
return <div>
<input ref = {node => {
input = node;
}} />
<button onClick = {() => {
onAddClick(input.value)
input.value='';
}}>Add Todo</button>
</div>
}
Это на самом деле работает, когда пристали к композитному компоненту приложения и ref не вернулся null
, как обещал React docs!
Реализация AddTodo
в композитном компоненте выглядит следующим образом:
class TodoApp extends Component {
render() {
//console.log(store.getState());
log();
const {
todos,
visibilityFilter,
} = this.props;
const visibleTodos = getVisibleTodos(
todos,
visibilityFilter
);
return (
<div>
<AddTodo onAddClick = {
(input) => {
store.dispatch({
type:'ADD_TODO',
text: input,
id: nextTodoId++,
})
}
}/>
Документы ли сказать, что мы можем обернуть без гражданства компонент в составном компоненте и прикрепить реф к композитному компоненту. Ключевым моментом здесь является привязка к составному компоненту, но моя ссылка по-прежнему привязана к stateless AddTodo
в моей реализации.
Мои вопросы:
AddTodo
здесь действительно является лицом без гражданства функциональный компонент, является то, что не так ли?Если нет, то почему бы и нет? (Это определенно похоже на одно, но мне могут не хватать основных признаков того, что означает быть апатридом)
Если да, то вопрос о том, как можно использовать
ref
, в соответствии с тем, что происходит представлены в документах React?
Если бы я должен был догадаться, это было бы так, что документы ссылаются на 'ref' the prop not' ref' функцию обратного вызова. – azium