Context.Consumer vs useContext () для доступа к значениям, переданным Context.Provider - PullRequest
Новая
       1

Context.Consumer vs useContext () для доступа к значениям, переданным Context.Provider

1 голос
/ 29 июня 2019 
<MyContext.Consumer>
    {value => { }}
</MyContext.Consumer>

VS

let value = useContext(MyContext);

В чем разница между этими двумя фрагментами, использующими Context.Consumer и перехватчиком useContext для доступа к значениям, переданным провайдером контекста?Я думаю, что useContext подпишется на провайдера контекста, поскольку мы передали контекст в качестве аргумента, чтобы он вызывал повторную визуализацию при изменении значения провайдера.

1 Ответ

3 голосов
/ 29 июня 2019

Это правильно.Они будут делать в основном то же самое.

На мой взгляд, хук useContext имеет намного более приятный и читаемый синтаксис.

Из React Docs:

https://reactjs.org/docs/hooks-reference.html#usecontext

useContext

const value = useContext (MyContext);Принимает объект контекста (значение, возвращенное из React.createContext) и возвращает текущее значение контекста для этого контекста.Текущее значение контекста определяется значением prop ближайшего над вызывающим компонентом в дереве.

Когда обновляется ближайший выше компонента, этот хук инициирует повторное рендеринг с последним переданным значением контекстаэтому провайдеру MyContext.

Также из React Docs:

https://reactjs.org/docs/context.html

Context.Consumer 

<MyContext.Consumer>
 {value => /* render something based on the context value */}
</MyContext.Consumer>

Компонент React, который подписывается на изменения контекста.Это позволяет вам подписаться на контекст внутри компонента функции.

ОБНОВЛЕНИЕ:

От: http://brianyang.com/react-hooks-a-deeper-dive-featuring-usecontext-and-usereducer/

Новый useContext хук для использования контекста не меняет концепций, окружающих контекст, , следовательно, погружение выше.Этот контекстный хук только дает нам дополнительный, намного более красивый способ использования контекста.Это удивительно полезно при применении к компонентам, использующим несколько контекстов.

...