2

我很难理解聚合物元素的生命周期。

假设我有一个具有单个属性的自定义元素fooBar。并假设我fooBar像这样将属性设置为属性。

<custom-element foo-bar="text"></custom-element>

现在假设我想fooBar在元素生命周期创建期间以编程方式将其用作属性。所以类似的东西。

Polymer({
    is: "custom-element",
    properties: {
        fooBar: {type: String}
    },
    ready: function(){
        console.log(this.fooBar)
    }, 
    attached: function(){
        console.log(this.fooBar)
    }
})

据我所知，元素属性 fooBar 不会从 DOM 属性 fooBar 加载，直到两者ready都attached被调用之后。即使我从准备好的和附加的回调中调用 async也是如此。

谁能解释（1）元素属性在生命周期中从DOM属性导入的位置以及（2）如何以编程方式访问这些属性以对元素进行一些设置工作？

4

1 回答 1

1

如果您已经阅读过自定义元素规范，那么在元素的生命周期中有一个回调函数attributeChangedCallback(name, oldVal, newVal)，它在 Polymer 中被方便地重命名为attributeChanged(type, name). 但是，这不是监听属性的首选方式，而是将观察者附加到该属性，在本例中为 on fooBar。

这是一个 jsbin 示例。您可以看到它在和fooBarChanged之前首先被调用。attachedready

http://jsbin.com/gibopu/edit?html，控制台，输出

于 2015-11-15T07:40:27.550 回答