mirror of https://github.com/status-im/reagent.git
Add special notation for id and classes
Inspired from this reddit comment: https://www.reddit.com/r/Clojure/comments/75d054/hiccupreagent_syntax_help/do5o0qh/
This commit is contained in:
parent
5693716a75
commit
bdbacf7bb8
|
@ -52,6 +52,46 @@ As of reagent 0.8.0, the `class` attribute accepts a collection of classes and w
|
|||
[:div {:class ["a-class" (when active? "active") "b-class"]}]
|
||||
```
|
||||
|
||||
## Special notation for id and class
|
||||
|
||||
The id of an element can be indicated with a hash (`#`) after the name of the element.
|
||||
|
||||
This:
|
||||
|
||||
```clojure
|
||||
[:div#my-id]
|
||||
```
|
||||
|
||||
is the same as this:
|
||||
|
||||
```clojure
|
||||
[:div {:id "my-id"}]
|
||||
```
|
||||
|
||||
One or more classes can indicated for an element with a `.` and the class-name like this:
|
||||
|
||||
```clojure
|
||||
[:div.my-class.my-other-class.etc]
|
||||
```
|
||||
|
||||
which is the same as:
|
||||
|
||||
```clojure
|
||||
[:div {:class ["my-class" "my-other-class" "etc"]}]
|
||||
```
|
||||
|
||||
Special notations for id and classes can be used together. The id must be listed first:
|
||||
|
||||
```clojure
|
||||
[:div#my-id.my-class.my-other-class]
|
||||
```
|
||||
|
||||
which is the same as:
|
||||
|
||||
```clojure
|
||||
[:div {:id "my-id" :class ["my-class" "my-other-class"]}]
|
||||
```
|
||||
|
||||
## Special notation for nested elements
|
||||
|
||||
Reagent extends standard Hiccup in one way: it is possible to "squeeze" elements together by using a `>` character.
|
||||
|
|
Loading…
Reference in New Issue