Передача общей опоры всем компонентам в файле многомерных выражений без добавления опоры для каждого компонента
У меня есть файлы mdx с компонентами, которые должны знать язык.
Множество компонентов. И все они должны знать региональные особенности.
В файлах .mdx я могу изменить их вот так:
<FirstDayOfMonth/>
к этому:
<FirstDayOfMonth lang="fr"/>
Но тогда мне нужно было бы сделать это для каждого компонента в каждом файле .mdx.
Есть ли способ сделать опору доступной для всех компонентов, используемых в MDX?
Я подумал передать его в MDXRenderer, примерно так:
<MDXProvider>
<MDXRenderer lang={currentLang}>{body}</MDXRenderer>
</MDXProvider>
Или доступ к передней панели из компонентов.
Но оба подхода не документированы и не дали результатов.
Лучшие идеи?
1 ответ
Вы можете добавить эти реквизиты при передаче шорткодов в
MDXProvider
путем итерации по карте и возврата новых компонентов с введенными свойствами по умолчанию.
import FirstDayOfMonth from 'path/to/FirstDayOfMonth';
const addProps = (components, defaultProps) => {
const withProps = {};
for (const [key, Component] of Object.entries(components)) {
withProps[key] = (props) => <Component {...defaultProps} {...props} />
}
return withProps;
}
const shortcuts = { FirstDayOfMonth, SomeOtherComponent };
const Layout = ({ children }) => {
const someDefaultProps = {
lang: "es",
something: "else",
};
const shortcodesWithProps = useMemo(
() => addProps(shortcodes, someDefaultProps),
someDefaultProps
);
return (
...
<>
<MDXProvider components={shortcodesWithProps}>
{children}
</MDXProvider>
</>
...
);
};