Preserve text-inputs default value

Signed-off-by: Vitaliy Vlasov <siphiuel@gmail.com>
This commit is contained in:
Vitaliy Vlasov 2019-09-05 02:27:01 +03:00
parent c3dd950286
commit b215292b23
No known key found for this signature in database
GPG Key ID: A7D57C347F2B2964
4 changed files with 20 additions and 9 deletions

View File

@ -126,14 +126,18 @@
[text-class (dissoc options-with-style :nested?)] [text-class (dissoc options-with-style :nested?)]
nested-text-elements))) nested-text-elements)))
(def text-input-refs (atom #{})) ;; We track all currently mounted text input refs
;; in a ref-to-defaultValue map
;; so that we can clear them (restore their default values)
;; when global react-navigation's onWillBlur event is invoked
(def text-input-refs (atom {}))
(defn text-input (defn text-input
[options text] [options text]
(let [input-ref (atom nil)] (let [input-ref (atom nil)]
(reagent/create-class (reagent/create-class
{:component-will-unmount #(when @input-ref {:component-will-unmount #(when @input-ref
(swap! text-input-refs disj @input-ref)) (swap! text-input-refs dissoc @input-ref))
:reagent-render :reagent-render
(fn [options text] (fn [options text]
[text-input-class [text-input-class
@ -143,11 +147,10 @@
:placeholder-text-color colors/text-gray :placeholder-text-color colors/text-gray
:placeholder (i18n/label :t/type-a-message) :placeholder (i18n/label :t/type-a-message)
:ref (fn [r] :ref (fn [r]
(if r ;; Store input and its defaultValue
(when (nil? @input-ref) ;; one we receive a non-nil ref
(swap! text-input-refs conj r)) (when (and r (nil? @input-ref))
(when @input-ref (swap! text-input-refs assoc r (:default-value options)))
(swap! text-input-refs disj @input-ref)))
(reset! input-ref r) (reset! input-ref r)
(when (:ref options) (when (:ref options)
((:ref options) r))) ((:ref options) r)))

View File

@ -37,6 +37,9 @@
(re-frame/dispatch [:contact.ui/contact-code-submitted])) (re-frame/dispatch [:contact.ui/contact-code-submitted]))
:placeholder (i18n/label :t/enter-contact-code) :placeholder (i18n/label :t/enter-contact-code)
:style (add-new.styles/input @tw) :style (add-new.styles/input @tw)
;; Set default-value as otherwise it will
;; be erased in global `onWillBlur` handler
:default-value new-identity
:accessibility-label :enter-contact-code-input :accessibility-label :enter-contact-code-input
:return-key-type :go}]] :return-key-type :go}]]
(when-not platform/desktop? (when-not platform/desktop?

View File

@ -34,6 +34,9 @@
:auto-capitalize :none :auto-capitalize :none
:auto-focus false :auto-focus false
:accessibility-label :chat-name-input :accessibility-label :chat-name-input
;; Set default-value as otherwise it will
;; be erased in global `onWillBlur` handler
:default-value topic
:placeholder nil :placeholder nil
:return-key-type :go :return-key-type :go
:auto-correct false}]]] :auto-correct false}]]]

View File

@ -40,8 +40,10 @@
:on-will-blur :on-will-blur
(fn [] (fn []
(reset! screen-focused? false) (reset! screen-focused? false)
(doseq [text-input @react/text-input-refs] ;; Reset currently mounted text inputs to their default values
(.clear text-input)))}]) ;; on navigating away; this is a privacy measure
(doseq [[text-input default-value] @react/text-input-refs]
(.setNativeProps text-input (clj->js {:text default-value}))))}])
(defn wrap (defn wrap
"Wraps screen with main view and adds navigation-events component" "Wraps screen with main view and adds navigation-events component"