reagent 2025-03-13

Does reagent process reactive components in select :options? I have (in short) [:select {...} (doall (for [op all-ops] [:option {:key op} [tr-set op]]))] which is creating a dropdown select menu and populating the options with a reagent component (using the vector instead of parentheses). this fills my dropdown with [object Object] instead of reactively rendering them.

✅ 1

Of course it should work. doall is not needed as well. Just tested with this:

(defn root-view []
  (r/with-let [options (r/atom [])]
    [:div
     [:button {:on-click #(swap! options (fn [opts]
                                           (let [id (inc (count opts))]
                                             (conj opts {:value id
                                                         :label (str "Option " id)}))))}
      "Add an option"]
     [:select
      (for [{:keys [value label]} @options]
        [:option {:value value
                  :key   value}
         label])]]))

If you don't have a lot of options, a slightly simpler way would be to use (into [:select] (map ...) all-ops) - it removes the need for :key.

i'm sorry, i mean a reactive function call: [:option ... [some-func op]]

What is some-func?

a function that returns hiccup

lol i just realized why this doesn't work

thank you for rubber ducking 🤦‍♀️

👍 1

<option> does not allow for any content other than plain text.

some-func could probably return some text inside [:<> ...] (fragment) and that should work, but yeah other elements wont work