Fork me on GitHub
#reagent
<
2019-06-30
>
valtteri06:06:56

@ballpark here’s a simple example how to integrate react-select with reagent https://gist.github.com/pesterhazy/4a4198a9cc040bf6fe13a476f25bac2c

👍 8
valtteri06:06:22

What works best for you depends pretty much on your use-case(s). What features you need and how much compatibility across different platforms and devices you need.

valtteri08:06:54

For very simple use-cases I’d probably just use HTML5 datalist

(defonce app-state (atom {:text "Hello world!"}))

(defn autocomplete [{:keys [items on-change]}]
  [:<>
   [:input {:type "text" :list "id-123" :on-change on-change}]
   [:datalist {:id "id-123"}
    (for [item items]
      [:option {:key item :value item}])]])

(defn hello-world []
  [:div
   [:h1 (:text @app-state)]

   [autocomplete
    {:items     ["cat" "dog" "sheep" "chicken" "whale"]
     :on-change #(swap! app-state assoc :selected-item (-> % .-target .-value))}]

   [:h3 (str "Selected item: " (or (:selected-item @app-state) "-"))]])

valtteri08:06:36

Very simple autocomplete in Reagent using HTML5 datalist