You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
First of all, I apologize if my terminology is not spot-on. And if this is indeed the right place, for questions - but I did not find a mailer. Also, as you can guess I am just treading into the whole SPA realm, and re-com/reagent are godsend for something like that. Thanks!
I want to build a data-driven UI, wherein the children elements in a parent element would be driven by dynamically received data (for e.g. you can imagine a variable number of buttons, in a h-box in a parent v-box). While doing this, to avoid adding a large number of such button children to the h-box, I need to make the rendering logic slightly more reactive, wherein a new row of h-box should be added if they are going to "overflow".
I was hoping to do this, by trying to get the Parent v-box width size and then figure out how much I need for each button (again the label on those buttons can be of varying length), and then figure out if I should move some of those buttons to another row (aka h-box) below.
I tried to get (reagent/current-component) but the only place it seems to work is at the top-most, returning something like ..main-panel (my div name, I guess).
How can I get the react "this" object via reagent further down below? And then use-it for further details like (r/props and r/children?)
Or is there another way, where I can dynamically decide how many children of varying length, I can add ? Or if there was some auto-magical way of wrapping the additional content to the next "line"..like a wrap for elements.
This discussion was converted from issue #203 on March 29, 2021 20:16.
Heading
Bold
Italic
Quote
Code
Link
Numbered list
Unordered list
Task list
Attach files
Mention
Reference
Menu
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
First of all, I apologize if my terminology is not spot-on. And if this is indeed the right place, for questions - but I did not find a mailer. Also, as you can guess I am just treading into the whole SPA realm, and re-com/reagent are godsend for something like that. Thanks!
I want to build a data-driven UI, wherein the children elements in a parent element would be driven by dynamically received data (for e.g. you can imagine a variable number of buttons, in a h-box in a parent v-box). While doing this, to avoid adding a large number of such button children to the h-box, I need to make the rendering logic slightly more reactive, wherein a new row of h-box should be added if they are going to "overflow".
I was hoping to do this, by trying to get the Parent v-box width size and then figure out how much I need for each button (again the label on those buttons can be of varying length), and then figure out if I should move some of those buttons to another row (aka h-box) below.
I tried to get (reagent/current-component) but the only place it seems to work is at the top-most, returning something like ..main-panel (my div name, I guess).
How can I get the react "this" object via reagent further down below? And then use-it for further details like (r/props and r/children?)
Or is there another way, where I can dynamically decide how many children of varying length, I can add ? Or if there was some auto-magical way of wrapping the additional content to the next "line"..like a wrap for elements.
Thanks for you help.
Beta Was this translation helpful? Give feedback.
All reactions