Skip to content

Commit 0091767

Browse files
committed
some docs
1 parent 8bfa8c9 commit 0091767

File tree

1 file changed

+31
-2
lines changed

1 file changed

+31
-2
lines changed

README.md

Lines changed: 31 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ Your `*_element.js` files have to `export default` custom elements for this to w
5252
> [!WARNING]
5353
> Only single word elements are supported currently. See https://github.com/codergeek121/custom_elements-rails/issues/1
5454
55-
## Add a custom element
55+
## Add a custom element with the built-in generator
5656

5757
This gem adds a generator to generate new custom elements with:
5858

@@ -73,11 +73,40 @@ export default class extends HTMLElement {
7373
console.log("test_element.js")
7474
}
7575
}
76-
7776
```
7877

7978
which in turn will register a `<app-test></app-test>` custom element automatically in your app.
8079

80+
```bash
81+
$ rails generate custom_element test
82+
```
83+
84+
To observe changes in your custom element's attributes, you need to set a static array of attribute names. The generator also supports setting those automatically:
85+
86+
```bash
87+
$ rails generate custom_element test attribute1
88+
```
89+
90+
will generate
91+
92+
```javascript
93+
export default class extends HTMLElement {
94+
static observedAttributes = ["attribute1"]
95+
96+
constructor() {
97+
super()
98+
}
99+
100+
connectedCallback() {
101+
console.log("test_element.js")
102+
}
103+
104+
get attribute1() {
105+
return this.getAttribute("attribute1")
106+
}
107+
}
108+
```
109+
81110
## Documentation
82111

83112
`eagerDefineCustomElementsFrom(under, options)`

0 commit comments

Comments
 (0)