This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2020-11-15
Channels
- # aleph (5)
- # announcements (1)
- # architecture (35)
- # babashka (9)
- # beginners (87)
- # chlorine-clover (13)
- # cider (3)
- # cljdoc (12)
- # clojure (16)
- # clojure-australia (2)
- # clojure-dev (4)
- # clojure-europe (5)
- # clojuredesign-podcast (21)
- # clojurescript (19)
- # conjure (1)
- # core-async (1)
- # data-science (1)
- # emacs (44)
- # events (2)
- # helix (1)
- # leiningen (2)
- # malli (31)
- # pathom (3)
- # pedestal (31)
- # portal (3)
- # reagent (20)
- # reitit (5)
- # reveal (2)
- # rewrite-clj (18)
- # tools-deps (6)
- # xtdb (5)
Hi, I am trying to create my own rich text editor using ContentEditable in Reagent. And I have found that when the text is changed, the cursor position is reset to offset 0. Likely it was already reported here: https://github.com/reagent-project/reagent/issues/220. Any idea how to solve this?
Take a look at how Reagent explicitly deals with :input
and :textarea
- perhaps the same technique can be used for :content-editable
.
Any idea where to look for this in the code?
What happens exactly: State of my component is updated and I know it is updated. I do rerendering and then in component-did-update, I am setting new position of cursor correctly. Afterwards, I will get onSelect event setting the offset to 0.
Reading now, seems related. Would be great to support contentEditable as well.
I don't understand Reagent enought to know what is going on. I was reading https://github.com/reagent-project/reagent/blob/master/src/reagent/impl/input.cljs, where input component is created with component-did-update function specified. This function deals with changing of DOM value and setting new cursor position.
Not sure what is happening here exactly: https://github.com/reagent-project/reagent/blob/master/src/reagent/impl/template.cljs#L210
I have updated the issue https://github.com/reagent-project/reagent/issues/220. Also is there some way how to run some function immediately after the next frame was rerendered? So I could set the selection there.
I have updated the issue https://github.com/reagent-project/reagent/issues/220. Also is there some way how to run some function immediately after the next frame was rerendered? So I could set the selection there.
Hi! Does anyone know how to convert this JSX to hiccup?
<YAxis type="number" domain={['dataMin', 'dataMax']} />
Particularly the value of the domainOk another question, how would I pass the function in the label formatter here (line 27): https://jsfiddle.net/alidingling/32zbsx71/1/ I tried an anonymous function but it didn't work
It should work as is - CLJS functions are JS functions. I have no idea what you might've done wrong without seeing the actual code.
This is what I attempted
[PieChart {:width 800 :height 300}
[Pie {:data (get-in data [:book-stats :bottom-5-longest]) :dataKey "num_pages"
:nameKey "title" :outerRadius 100 :innerRadius 20 :fill "#19A974"}]
[Legend {:formatter (fn [value entry]
[:span {:style {:color "blue"}} "ABC" ])}]
[Tooltip]
]]
The :formatter
function has to return a React element - not a Hiccup.
Wrap its result in reagent.core/as-element
.
If I use r/after-render inside component-did-update, is it guaranteed that it will occur after this component is rerendered, or could it happen before it is rerendered (due to something else in the queue rendered before?)
Ok another question, how would I pass the function in the label formatter here (line 27): https://jsfiddle.net/alidingling/32zbsx71/1/ I tried an anonymous function but it didn't work