Question

我正在尝试观察自定义元素属性的变化。不幸的是，我可以找到的关于自定义元素的所有文档（几乎没有内容）都是用JS编写的，而且我不知道如何将其中的某些代码转换为CoffeeScript。

JS：

class HelloElement extends HTMLElement {
// Monitor the 'name' attribute for changes.

    static get observedAttributes() {return ['name']; }
    // Respond to attribute changes.

    attributeChangedCallback(attr, oldValue, newValue) {
        if (attr == 'name') {
            this.textContent = `Hello, ${newValue}`;
        }
    }
}

到目前为止，我已经写了这个：

class HelloElement extends HTMLElement

    #STUCK HERE!
    #I can't figure out how to convert the get observedAttributes() method....

    attributeChangedCallback(attr, oldValue, newValue): ->
        if attr == 'name'
            @textContent = 'Hello, ' + newValue

但是我不知道如何在CoffeeScript中编写“获取观察到的属性”方法。有人可以帮我吗？：）

谢谢

Answer 1

class HelloElement extends HTMLElement
    @observedAttributes: ['name']

    attributeChangedCallback: (attr, oldValue, newValue) ->
        console.log("attr #{ attr } changed from #{ oldValue } to #{ newValue }")

感谢Reddit用户_redka（https://www.reddit.com/user/_redka/）提供此解决方案！

如何使用CoffeeScript观察自定义元素中的属性？

1 个答案: