This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2016-06-22
Channels
- # beginners (8)
- # boot (41)
- # cider (1)
- # cljsrn (2)
- # clojure (91)
- # clojure-dev (34)
- # clojure-gamedev (3)
- # clojure-germany (6)
- # clojure-greece (324)
- # clojure-japan (2)
- # clojure-miami (4)
- # clojure-nl (6)
- # clojure-quebec (3)
- # clojure-russia (26)
- # clojure-spec (50)
- # clojure-uk (19)
- # clojurescript (147)
- # core-async (5)
- # css (2)
- # cursive (15)
- # datascript (7)
- # datomic (6)
- # hoplon (1)
- # jobs (4)
- # lein-figwheel (17)
- # off-topic (4)
- # om (52)
- # om-next (10)
- # onyx (1)
- # planck (19)
- # proton (1)
- # re-frame (81)
- # reagent (61)
- # spacemacs (1)
- # specter (46)
- # spirituality-ethics (7)
- # untangled (7)
- # yada (17)
if i have a callback function that gets on arg, and call it on data-onsuccess, how do i put that in reagent?
@pvinis: code example?
hard to tell what you are asking for related to reagent...seems more like a coding question about callbacks
sbmitchell: i am trying to write this in reagent https://developers.google.com/identity/sign-in/web/
and i wrote this
(defn handle-google-signin [google-user]
(let [profile (.getBasicProfile google-user)]
(d/log (str "full name" (.getName profile)))))
(defn google-signin-component [name]
[:div {:class "g-signin2"
:data-onsuccess #(handle-google-signin)}])
but i get a WARNING: Wrong number of args (0) passed to test.reagent/handle-google-signin at line 21 src/cljs/test/reagent.cljs
what is data-onsuccess?
I've never seen this kind of invocation for a handler
can you call a fn out of a data attribute
aside from that you just need to pass in an argument into 'handle-google-signin' call
I have no idea what you are doing from that code sample @pvinis
are you trying to do something like... this
what is data-onsuccess? how can that even be called I dont understand how that code works
oh I see its based on having googles script
its going to read from that...
sorry I didnt realize your link was a link to an example
do you have this code <script src="https://apis.google.com/js/platform.js" async defer></script>
embedded
you probably cant pass arguments into that..since its a string lookup?
the embedded script is passing that stuff in for you..
dont worry about my code example thats not what u want
you are trying to integrate with google api
which takes one arg, but in the component, how do i set up to call the func without the argument?
data-onsuccess="onSignIn"
should translate to :data-onsuccess "handle-google-signin"
you dont pass in the argument
its a string
the fn itself will get the argument bc the embedded google api script takes that fn name and then applies arguments to it dynamicaly
thats why I was confused as to what 'data-onsuccess' is
no make it a string
not make it an anon fn
yea metametadata is correct I think
yeah, but it still can fail because: 1) there's a chance google's script is run before Reagent renders the div 2) even if 1) is not the case, compiler optimization can mungle the function name and it won't be called
yea I think youd need to wrap this call into component-did-mount
and append the dom element dynamically perhaps
not sure
I wouldnt be using this personally...id try use the api directly lol
using their DOM version is probably easier in JS land when they give you the snipper..not sure how it translates into reagent land honestly
snippet*
oh, :data-onsuccess "handle-google-signin"
will also definitely not work because in JS land functions cannot have`-` chars in them
I'd suggest looking at React examples of using this API and then try to translate them to Reagent
Thats a good suggestion
how would i make <script src="https://apis.google.com/js/client.js?onload=init"></script>
into reagent? this would normally go in the head of the html, along with a script that contains an init function
well a script is just a tag so you could just insert it
[:script {:src "xxx"}]
well you could do it within component-did-mount
lifecycle and append to head
or you could just embed it right in the component
or even attach it to the body
its really however you want to do it...