Как правильно реализовать contextType в функциональных компонентах реагировать?

Question

В версииactjs 16 ... было добавлено свойство contextType, а также поощрялось использование функциональных компонентов. но по какой-то причине, похоже, нет документации об использовании их обоих вместе. Единственными найденными примерами являются примеры использования contextType в комбинации с компонентом класса. У кого-нибудь есть пример использования contextType в структуре функциональных компонентов?

Answer 1

Используйте крючок useContext(). Из документа React:

Совет

Если вы знакомы с контекстным API до хуков, useContext(MyContext) эквивалентен static contextType = MyContext в классе или <MyContext.Consumer>.

useContext(MyContext) только позволяет читать контекст и подписываться на его изменения. Вам все еще нужно <MyContext.Provider> выше в дереве, чтобы предоставил значение для этого контекста.