We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Given the template
<div class="container flex flex-wrap items-center justify-between p-4 mx-auto sm:p-6 "> {{comp.Button({text:"example1"})}} {{comp.Button({text:"example2"})}} </div>
What I really want is to slot content into a reusable component, like React
<Container> {{comp.Button({text:"example1"})}} {{comp.Button({text:"example2"})}} </Container>
My initial thought is to pass in like this...
{{comp.Container({content:[ comp.Button({text:"example1"}), comp.Button({text:"example1"}) ]})}}
but is starting to look messy, is there a way to put JSX components inside NJK? or somehow pass NJK blocks to a NJK component?
The text was updated successfully, but these errors were encountered:
You can use lume components as react components. For example:
export default function Container({ comp }) { return <> <comp.Button text="example1" /> <comp.Button text="example2" /> </> }
And then this component can be used in other jsx component or nunjucks:
<div> {{ comp.Container() }} </div>
The comp argument is always available not only in the layouts but also the components.
comp
FYI, I'm planning to implement the following syntax for components in nunjucks:
{% comp Container %} {{comp.Button({text:"example1"})}} {{comp.Button({text:"example2"})}} {% endcomp %}
So this ease the use of nested components. But it's not implemented yet.
Sorry, something went wrong.
getting started to implement #189
cc393b5
allow nested components in nunjucks #189
f81f7c4
No branches or pull requests
Given the template
What I really want is to slot content into a reusable component, like React
My initial thought is to pass in like this...
but is starting to look messy, is there a way to put JSX components inside NJK? or somehow pass NJK blocks to a NJK component?
The text was updated successfully, but these errors were encountered: