Fork me on GitHub
#reagent
<
2020-02-29
>
mwolf23:02:52

I'm getting a warning from react: "A component is changing a controlled input of type checkbox to be uncontrolled". I read the referenced react doc as well as the ControlledInputs.md doc on github, but not having worked with react (or reagent for that matter) previously, can anyone easily spot the issue with this control?

(defn boolean-field-editor
  [path label _]
  (let [value (rf/subscribe [:current-edit-record-value path])]
    (fn [path]
      [:div.form-group.row {:key (str path)}
       [:label.form-check-label.col-md-2 {:for (str path)} label]
       [:input.form-check-input.col-md-10 {:type "checkbox"
                                           :id (str path)
                                           :checked @value
                                           :on-change #(rf/dispatch [:set-current-edit-record-value path (-> % .-target .-checked)])}]])))
btw, it renders without warning sometimes ... there was something about async rendering in the reagent doc, not sure if that's related.

J.P. Vermeer17:03:40

If you add a :value attribute, it will likely go away IIRC