Web 组件可以通过多种方式接收数据，但最常见的方式之一是使用特性，因为特性是声明式的、静态的，并且在 HTML 中易于读写！

浏览器中的每个 HTML 元素都有特性和属性：

• 特性是描述 HTML 中元素状态的附加值。特性只能是字符串值。
• 属性是元素 JavaScript DOM 对象的实例属性。属性可以是任何类型的值，例如数字、布尔值和数组。

内置元素通常会将属性与同名的特性匹配。 例如，<input> 元素既有 value 特性，也有 value 属性。

<input value="This is setting the 'value' attribute">
<script>
  const inputElementReference = document.querySelector('input');
  inputElementReference.value = 'This is setting the "value" property';
</script>

设置 value 特性也会设置 value 属性，因此你可以通过静态标记为输入框设置默认值！

由于 Lit 元素是 HTML 元素，所以 Lit 元素既有特性也有属性。 当你定义一个响应式属性时，你可以设置一个映射到该属性的特性，并指定如何将特性值转换为属性值。Lit 为常见类型（如数字和布尔值）提供了内置转换器。但如果你想转换为 Lit 默认不支持的类型，你可能需要编写一些代码。

一个例子是 Date 对象——你可以在 playground 预览中看到这个示例。Date 对象是通过 JavaScript 属性在 index.html 中传入的，而不是通过可读的字符串特性。你可以点击 Solve 按钮来查看预览中的预期行为。

自定义特性转换器就是用来解决这个问题的。

• 什么是特性转换器？
• Lit 的内置特性转换器是如何工作的？
• 如何编写你自己的特性转换器。

在本教程中，你将构建一个组件，它接收一个可读的日期字符串，将其转换为 JavaScript Date 对象，并以可读的格式显示给定的日期。

你将先使用默认的特性转换器来完成，然后通过自定义特性转换器来升级组件，使其能够将日期字符串特性转换为 JavaScript Date 对象属性，以及反向转换。

如果你了解 Lit 中响应式属性的基础知识，以及 willUpdate Lit 生命周期方法，会很有帮助。这两个主题都在响应性教程中有所涵盖。