feather-app
feather-app copied to clipboard
Nested views/components
I would like to try to use this toolkit with a real-life app but I am missing embedded views/components. Any plans or recommendation for that?
What do you mean by "embedded"?
Sorry, my mistake. I meant nested. I fixed the question also.
Ah, no worries. Hi! By the way :)
It's cool that you want to try it, just beware that I myself have not yet build anything of significance with these approaches. I'm working on it, but finishing up a contract before I'll have the time to dedicate to it. So I'm not kidding when I say its experimental :)
Anyway, to you question... you can do like this, it's just a little different looking than react.
But since they're just functions that return vdom snippets you can just call this functions with whatever arguments you want to pass through and insert the result in another component like this:
import otherComponent from './other'
export default () => (
<main>
<h1>Feather POC App</h1>
<nav>
<a href='/'>home</a>
<a href='/about'>about</a>
<a href='/form'>form</a>
<a href='/item/1'>item 1</a>
<a href='/item/2'>item 2</a>
</nav>
{ otherComponent({prop1: "something"} }
</main>
)
(Typed on a phone sorry if looks off :))
Hi Henrik (sorry I missed that one, I get mixed feedback on saying or not saying hi, though I should just do it)
Your solution just makes total sense, no idea why I didn’t think of it.
And sure, this is still experimental, but I still like it :) So I’m giving it a spin sometime in the next few weeks on a personal project, I’ll get back here with feedback.
Thanks for helping!