Save context between components
Allow you to add extra props without the need to manually add them every time
layouts/Layout.astro
---
import Context from '@astro-utils/context/context.js';
function consoleIt(){
console.log('Hi');
}
---
<Context title="Context is cool" consoleIt={consoleIt}>
<slot/>
</Context>
components/LayoutTitle.astro
---
import getContextProps from '@astro-utils';
const {title, consoleIt} = getContextProps(Astro);
consoleIt();
---
<h2>{title}</h2>
pages/index.astro
---
import Layout from '../layouts/Layout.astro';
import LayoutTitle from '../components/LayoutTitle.astro';
---
<Layout>
<LayoutTitle/>
</Layout>
// remember to change the name if you have multiple contexts
function getContextProps(astro: AstroGlobal, name = "default"): {[key: string]: any}
Every new context inherits the last one
async function readerInContext<T>(promise: () => Promise<T>, astro: AstroGlobal, name = "default"): Promise<T>
Same as Context.astro
, help you render astro inside the props context