Comments (3)
I've managed to invent a solution, the trick is in converting the attrs to a list, because to-js
doesn't handle those.
I have a copied version of to-js-map
in my project, which doesn't call to-js
on vals, only on keys. Then I use a handler like so:
(fn [_ klass attrs & children]
[klass (my-to-js-map {":my-namespace/attrs" attrs}) children])
This I then combine with a simple macro to get that key automatically out and present it as a binding.
This isn't perfect, because you lose some important things like :key
, so ideally this should perform a merge
.
from hicada.
I solved the :key
issue by adding some special code to to-js-map
so that it would add ":my-namespace/attrs"
at a top-level, but then I noticed that if I did this it would break:
(let [f #(assoc % :key (:name %))]
(html
[:< component (f {:name "jeff"})]))
So I wrote this js* based version as well:
(list 'js*
"(function (prop){
prop[':my-namespace/attrs'] = ~{};
return prop;
})(~{})"
attrs
(hicada.compiler/to-js attrs))
While it is a little bit funky, it is also pretty robust. I don't know if calling functions on props is officially supported in hicada, but this allows it to become possible in the future at least.
from hicada.
On Penpot we have a :&
special handler that just converts the first level of props to js (at compile time), this allows use this handler with our components and pass clojurescript data sturctures without converting them to js.
If there are interest, I can port it here ;)
from hicada.
Related Issues (13)
- Hicada to HTML String ? HOT 2
- Attrs type hint HOT 10
- trouble compiling project HOT 3
- Should `compile-html` walk everything? HOT 1
- Use with Rum? HOT 4
- Private discussion HOT 1
- Isomorphic rendering? HOT 8
- Optional props for :> HOT 1
- Incorrect result on compiling `cond` with more than 4 conditions. HOT 2
- Server side rendering HOT 1
- Deploy a new version (> 0.1.8) HOT 1
- The 0.1.9 causes regression HOT 5
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hicada.