This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-06-12
Channels
- # beginners (36)
- # boot (11)
- # cider (10)
- # cljs-dev (10)
- # cljsrn (3)
- # clojure (103)
- # clojure-greece (1)
- # clojure-italy (16)
- # clojure-nl (3)
- # clojure-spec (59)
- # clojure-uk (129)
- # clojurescript (125)
- # data-science (29)
- # datomic (30)
- # emacs (12)
- # events (5)
- # fulcro (61)
- # graphql (5)
- # keechma (3)
- # leiningen (9)
- # luminus (7)
- # onyx (26)
- # re-frame (3)
- # reagent (56)
- # reitit (25)
- # ring-swagger (16)
- # shadow-cljs (44)
- # spacemacs (4)
- # specter (2)
- # tools-deps (7)
- # vim (8)
[:input
{:name "important-name"
:error? (foo)}]
What is the easiest way to get name
of the input in foo
in error?
? Probably some js code?I have deep reason to do it in that way. I am trying to write module to make simpler code for form in SPA.
it’s a little hard to understand what you’re trying to do. why not (let [name "important-name"] [:input { use name here }])
I need to do somethig like that:
(defn show-error? [...]
(let [name (get-name-from-input)]
...))
I can write everywhere (show-error? :email), (show-error? :password), but probably I can make it simpler by get this :name
attribute from input
that’s going to be awkward. why don’t you just write a utility that generates the form/input directly instead of trying to decorate an already existing one? if you are sure that you’re going to be passed a hiccup, then you can probably do (get-in form 1 :name)
but that is not idiomatic reagent code
Making my own input will limit customisation of code. For example this is my current input:
[mui/text-field
{:on-change value->atom
:on-blur name->atom
:error email-error?
:helper-text (if email-error?
(:email @names->error)
" ")
:full-width true
:auto-focus true
:margin "normal"
:name "email"
:label "Email"}]
well as I said, you can pass hiccup to the show-error?
function and then just query it. it is a normal cljs datastructure like any other
you’d have to either pass the hiccup directly to email-error?
or invoke a function directly like [show-error? [mui/text-field …]]
or [show-error? (make-text-field ...)]
you need to factor the data that is common to your decorator and the underlying elements
For now I decided to do it in that way:
(let [specs->msg {::sc/email "Typo? It doesn't look valid."
::sc/password "Password is required."}
names->spec {:email ::sc/email
:password ::sc/password}
names->value (r/atom {:email ""
:password ""})
form (form/init-form names->value names->spec specs->msg)
value->form (form/fn-value->form form)
name->touched (form/fn-name->touched form)
form-valid? (form/form-valid? form)]
...)
[mui/text-field
{:on-change value->form
:on-blur name->touched
:error email-error?
:helper-text (if email-error?
(form/get-error form :email)
" ")
:full-width true
:auto-focus true
:margin "normal"
:name "email"
:label "Email"}]
thanks, I ended up doing this
(defn- focused-input
[_ on-change]
(r/create-class
{:component-did-mount
#(.focus (r/dom-node %))
:reagent-render
(fn [value]
[:input.no-border.overlay-search.bg-transparent
{:id :overlay-search
:value value
:on-change on-search
:placeholder "Search..."}])}))
yea. and you have to if you want to get a ref to anything except for the top-level node
I mean I would have done it with refs as well, but since it’s just the root dom node I’m interested in, I think this makes more sense
though that conversation involved a finally clause and i was wondering if that was the issue
I do use finally as well, but seems to be working fine. I’m using shadow-cljs
though, not sure if that would change anything
another question if I may - in the docs of rswap!
vs swap!
, it says that rswap!
returns nil and that this is useful. and there’s an event emitter example. I would’ve thought that it’s possible to create the same event emitter using swap!
too