将属性指定为 `type: Array` 似乎无法正确解析字符串属性值

Question

更新： 在 https://github.com/Polymer/lit-element/issues/411

提交了错误

根据指南中的信息，我无法实现属性的默认和自定义转换器。在当前版本 (0.6.5) 中，它说您可以将类型 Array 分配给属性并且它将自动从属性的字符串值中解析为 JSON ，但是代码示例中描述的情况似乎并非如此。

这是问题的说明。在控制台中，它应该报告一个包含三个元素的数组，但它 returns 一个元素的数组，即包含属性值的字符串。 render 方法的结果也只显示一个包含单个字符串的 <p> 元素。

<script type="module">
import { LitElement, html } from 'https://unpkg.com/@polymer/lit-element@0.6.5/lit-element.js?module';

class Histogram extends LitElement {
  static get properties() {
    return {
      values: { type: Array }
    };
  }
  
  constructor() {
    super();
    this.values = [];
  }
  
  render() {
    console.log(Array.isArray(this.values), this.values);
    return html`
<div>
  The elements:
  ${this.values.map(item => html`<p>item: ${item}</p>`)}
</div>
`;
  }
}

customElements.define('x-histogram', Histogram);
</script>

<x-histogram values="[1,2,3]"/>

我也尝试通过提供 converter 来修改示例，但它似乎也没有被调用。我做错了什么？

Answer 1

我看过了。 0.6.5 updating-element.js 文件甚至没有数组转换。查看 0.6.5 的 npm 包，它也没有提到数组。

但是master分支确实映射了数组类型，在readme中有提到。拉出来直接用应该有用

将属性指定为 `type: Array` 似乎无法正确解析字符串属性值

Specifying a property as `type: Array` doesn't seem to parse the string property value correctly

polymer

polymer-3.x

lit-element

将 属性 指定为 `type: Array` 似乎无法正确解析字符串 属性 值

Specifying a property as `type: Array` doesn't seem to parse the string property value correctly

polymer

polymer-3.x

lit-element

将属性指定为 `type: Array` 似乎无法正确解析字符串属性值