Polymer 1.0布爾屬性，默認值設置為true

Question

我有一個Polymer 1.0自定義元素，它具有boolean類型的屬性，默認值設置為true：

    myProperty: {
        type: Boolean,
        value: true
    }

在我的單元測試中，我將my-property設置為false來實例化這個自定義元素：

<my-custom-element id="myElem" my-property="false"></my-custom-element>

 var elem = document.getElementById('myElem');

 test('it_should_set_myProperty_to_false', function () {
     assert.equal(elem.myProperty, false);
 })

單元測試失敗了。 當我希望它是假的時候， elem.myProperty實際上設置為true。 為什么是這樣？

Answer 1

布爾值屬性的行為在Polymer 1.0中已更改 ，現在遵循HTML布爾屬性的規范。 如果元素上存在屬性（無論屬性值如何），則該屬性設置為true，如果未指定屬性，則不會發生反序列化。 因此，如果最初為true，則無法將布爾屬性設置為false。

您只能將屬性的默認值設置為false

myProperty: {
   type: Boolean,
   value: false
}

然后設置屬性使myProperty true。

<my-element my-property></my-element>

在Polymer項目的一些問題中討論了該主題，例如此處和此處 。

第二個問題還提到了使用Object類型的屬性的解決方法。 因為這些屬性是使用JSON.parse反序列化的，所以可以使用my-property="false"和my-property="true"指定一個布爾值。