React.createContext точка defaultValue?
На Страница контекстной документации React 16 у них есть примеры, похожие на это:
const defaultValue = 'light';
const SomeContext = React.createContext(defaultValue);
const startingValue = 'light';
const App = () => (
<SomeContext.Provider theme = {startingValue}>
Content
</SomeContext.Provider>
)
Кажется, что defaultValue бесполезен, потому что, если вы вместо этого установите startingValue на что-нибудь еще или не установите его (это undefined), он переопределит его. Это нормально, так и должно быть.
Но в чем тогда смысл defaultValue?
Если я хочу иметь статический контекст, который не меняется, было бы неплохо иметь возможность просто сделать следующее, и просто позволить Провайдеру пройти через defaultValue
const App = () => (
<SomeContext.Provider>
Content
</SomeContext.Provider>
)
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Если Provider отсутствует, для функции createContext используется аргумент defaultValue. Это полезно для изолированного тестирования компонентов без упаковки или тестирования с разными значениями от Provider.
Если вы хотите создать синглтон в своем приложении, рекомендуется ли предоставлять только поставщика контекста (он всегда будет возвращать значение по умолчанию)?
Так что это снова взлом на вершине взлома.
так зол на это ... так что есть ДВА значения по умолчанию, которые используются в зависимости от того, правильно ли настроен провайдер. скажите, что провайдер не настроен должным образом, вы получите значение по умолчанию, а не начальное значение, и скажите, почему это неправильно
Мои два цента:
Прочитав эта поучительная статья Кента К. Доддса, как обычно :), я узнал, что defaultValue полезно, когда вы деструктурируете значение, возвращаемое useContext:
Определите контекст в одном углу кодовой базы без defaultValue:
const CountStateContext = React.createContext() // <-- define the context in one corner of the codebase without defaultValue
и используйте его так в компоненте:
const { count } = React.useContext(CountStateContext)
JS явно скажет TypeError: Cannot read property 'count' of undefined
Но вы можете просто не делать этого и вообще избегать значения defaultValue.
Что касается тестов, мой учитель Кент прав, когда говорит:
The React docs suggest that providing a default value "can be helpful in testing components in isolation without wrapping them." While it's true that it allows you to do this, I disagree that it's better than wrapping your components with the necessary context. Remember that every time you do something in your test that you don't do in your application, you reduce the amount of confidence that test can give you.
Дополнительно для TypeScript; если вы не хотите использовать defaultValue, легко угодить ворсу, выполнив следующие действия:
const MyFancyContext = React.createContext<MyFancyType | undefined>(undefined)
Вам нужно только обязательно добавить дополнительные проверки позже, чтобы убедиться, что вы охватили случаи, когда MyFancyContext === undefined
- MyFancyContext ?? 'По умолчанию'
- MyFancyContext? .NotThatFancyProperty
так далее
from responsejs.org/docs/context.html#reactcreatecontext: «Аргумент defaultValue используется только в том случае, если компонент не имеет соответствующего Provider над ним в дереве. Это может быть полезно для изолированного тестирования компонентов без их упаковки. Примечание: передача undefined в качестве значения Provider не вызывает потребления компоненты для использования defaultValue. "