Блог

Главная - Вопросы по программированию - Реагирующая навигация Получить высоту заголовка навигатора стека внутри компонента класса (без зацепок)

Реагирующая навигация Получить высоту заголовка навигатора стека внутри компонента класса (без зацепок)

#react-native #react-navigation #react-navigation-v5

#react-native #реагирование-навигация #реагирующая навигация-v5

Вопрос:

Я знаю, что можно получить высоту заголовка стека с помощью следующего перехвата (V5):

 import { useHeaderHeight } from '@react-navigation/stack';

Есть ли обходной путь для компонента класса? На данный момент я использую контекстный потребитель для получения высоты внутри функции render () :

 <HeaderHeightContext.Consumer>
                  {headerHeight => (   
    ...
    )}
</HeaderHeightContext.Consumer>

Но я хотел бы иметь headerHeight вне моей функции render () .

Ответ №1:

Пробовали ли вы в своем компоненте что-то подобное:

 static contextType = HeaderHeightContext;

componentDidMount() {
   console.log(this.context); // this is your height
}

Из документации:

Свойству ContextType класса может быть присвоен объект контекста, созданный React.createContext(). Это позволяет использовать ближайшее текущее значение этого типа контекста, используя this.context

Комментарии:

1. Я получаю: TypeError: undefined is not an object (evaluating '_this.context.headerHeight')

2. Вот как я тестировал: class AddProductScreen extends React.Component { static contextType = HeaderHeightContext; constructor(props) { super(props); const { headerHeight } = this.context; console.log(headerHeight); ... }

3. Больше ошибок нет, но значение headerHeight равно undefined

4. 56 Я думаю, это то, что я ищу? Не могли бы вы просто объяснить, как мы это получили?

5. это BS: ошибка типа: не удается прочитать свойства undefined (чтение ‘headerHeight’)