Created
April 18, 2017 19:22
-
-
Save ricardo-rossi/b49cc9e9ee533f5d29d57112f4c45815 to your computer and use it in GitHub Desktop.
ReactJS Component for type ahead
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
(defn typeahead [data owner] | |
(reify | |
om/IInitState | |
(init-state [_] {:text ""}) | |
om/IRenderState | |
(render-state [_ {:keys [text]}] | |
(let [words (:words data)] | |
(dom/div nil | |
(dom/h2 nil "Tag") | |
(dom/input | |
#js {:type "text" | |
:ref "text-field" | |
:value text | |
:onChange #(change % owner)}) | |
(apply dom/ul nil | |
(om/build-all item words | |
{:fn (fn [x] | |
(if-not (string/blank? text) | |
(cond-> x | |
(not (zero? (.indexOf (:word x) text))) (assoc :hidden true)) | |
x))}))))))) | |
(om/root typeahead app-state {:target (.getElementById js/document "app")}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment