Fork me on GitHub

@reefersleep I have now put up an example project of how I was able to use transition-group with reagent:


I have a form with a bunch of inputs, and when a user hits "submit", I want to pass the values of all the form fields to a function to process the inputs. What's the idiomatic way to do that? The other think I've been able to come up with is using .getElementById and then unpacking the form field to get the value for each value. That doesn't seem right. Based on the docs, it seems like maybe a more idiomatic thing to do is to have each field be a component with its own state?


complete reagent noob, so feel free to tell me I'm doing it wrong 🙂


Use a callback ref on the form


@alexschoof I have each input field as component with its state residing in the global app-state ratom. On the submit button, I then will run through the validations for each component on submitting.


Has anyone encountered (i have long list so i have to scroll) that after clicking 'next" (button that requires new set of things to show) browser window stays in middle of page and doesnt scroll up? how do i fix it?


@pesterhazy do you know if there are docs anywhere with what the signature on the callback looks like?


@gadfly361 so you just deref/update the global state atom in each component


@lepistane try adding this to whatever function you are calling to click next

(defn- scroll-to-top []
  (.scroll js/window 0 0))


@gadfly361 is this what i am encountering normal behavior? feels like a hack to manually set scroll to top.


@alexschoof In essence yes. However, I use reagent cursors to not deref the entirety of app-state in a given component


@lepistane I think what you are encountering is normal behavior. Since react/reagent are SPAs, the idea of navigating to a new page is artificial


@gadfly361 thanks! I'll go check that out