Polymer 1.0 布尔属性，默认值设置为 true

Question

我有一个 Polymer 1.0 自定义元素，该元素具有布尔类型的属性，默认值设置为 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，而我认为它是 false。这是为什么呢？

Answer 1

布尔属性 has changed in Polymer 1.0 的行为现在遵循 HTML 布尔属性的规范。如果元素上存在该属性（无论属性值如何），则该属性设置为 true，如果未指定该属性，则不会发生反序列化。因此，如果布尔属性最初为 true，则不能将其设置为 false。

只能将属性的默认值设置为false

myProperty: {
   type: Boolean,
   value: false
}

然后设置属性使myProperty为真。

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

Polymer 项目的一些问题中讨论了这个主题，例如here 和here。

第二个问题还提到了使用Object 类型的属性的解决方法。因为这些属性是用JSON.parse 反序列化的，所以您可以用my-property="false" 和my-property="true" 指定一个布尔值。