glodrei
Version:
useful add-ons for react-three-fiber
34 lines (29 loc) • 954 B
text/mdx
title: useContextBridge
sourcecode: src/core/useContextBridge.tsx
[](https://drei.pmnd.rs/?path=/story/misc-usecontextbridge--use-context-bridge-st)
Allows you to forward contexts provided above the `<Canvas />` to be consumed from within the `<Canvas />` normally
```jsx
function SceneWrapper() {
// bridge any number of contexts
// Note: These contexts must be provided by something above this SceneWrapper component
// You cannot render the providers for these contexts inside this component
const ContextBridge = useContextBridge(ThemeContext, GreetingContext)
return (
<Canvas>
<ContextBridge>
<Scene />
</ContextBridge>
</Canvas>
)
}
function Scene() {
// we can now consume a context within the Canvas
const theme = React.useContext(ThemeContext)
const greeting = React.useContext(GreetingContext)
return (
//...
)
}
```