4

我熟悉{{variable}}Polymer 0.5 中带有花括号的绑定，例如 .

但是，在 Polymer 发行版的示例和代码片段中，我已经开始注意到带有方括号的绑定，例如[[variable]], 。

{{variable}}现在意味着不同的东西，还是相同的东西[[variable]]只是一个补充？[[variable]]绑定到 Polymer和绑定到 Polymer 有什么区别{{variable}}？

4

1 回答 1

6

正如您所注意到的，现在有两种不同的数据绑定语法，它们有不同的用途：

  • {{variable}}表示您希望 Polymer 自动检测绑定应该是one-way 还是 two-way。
  • [[variable]]表示您只想绑定到单向。

为什么改变？

Polymer 1.x 与旧版本的不同之处在于，绑定现在默认是单向的，与 0.5 不同，它们总是双向的。

换句话说，如果你写

<my-element some-property="{{myVariable}}"></my-element>

那么默认情况下，当

  • myVariable 已更改，Polymer 更新绑定，从而更新my-element.someProperty
  • someProperty 被更改，Polymer 不会更新绑定到myVariable.

除非您notify:true在里面的属性上设置，否则情况总是如此my-element：

Polymer({
  is: 'my-element',
  properties: {
    someProperty: {
      notify: true,
      ...

有了notify: true，绑定现在是双向的，所以当

  • myVariable 已更改，Polymer 将绑定更新为someProperty.
  • someProperty 改变了，Polymer也更新了绑定到myVariable.

这种行为（使用 时notify: true）曾经是 0.5 的默认行为；现在你必须明确要求它。

何时使用 [[变量]]

您必须使用没有技术原因[[variable]]，因为 Polymer 会自动检测绑定是单向还是双向{{variable}}。那你为什么要使用它？

假设您在一个大型项目中工作，并且您知道基于数据在特定页面/元素中流动的方式，某个属性不应该被它所绑定的元素更改，例如在这种情况下在功能上用作标签的元素的：

<display-data source-data="{{data}}"></display-data>
...
<data-editor source-data="{{data}}"></data-editor>

一切看起来都不错！该data属性绑定到display-data元素和data-editor元素，并将在它们之间自动共享。（在这个例子中，假设display-data的唯一目的是预览它所绑定的数据。）

有一天，您或其他人正在编辑display-data，而您忘记了上面使用它的情况。对于完全不同的用例，您或其他开发人员还希望display-data格式化或以其他方式修改提供的数据并将其推回可能绑定到它的任何其他元素。您/他们display-data这样编辑：

  • 添加notify: true到sourceData, 以允许双向数据绑定。
  • 添加display-data修改sourceData属性的代码。

这适用于所有需要此功能的页面。但是在前面提到的页面上，这不是故意的，最终会混淆data-editor看到的数据！

这个问题本来可以避免的：

  • 开发团队沟通得更好，并且更加考虑元素的使用位置，
  • 和/或[[data]]用于代替{{data}}相关页面/元素。

和

<display-data source-data="[[data]]"></display-data>
...
<data-editor source-data="{{data}}"></data-editor>

data-editor可以更改data，但display-data只能读取，并且在更改其属性data的值时无法更改其值，即使设置为 on 也是如此。sourceDatanotify: truesourceData

因此，它可能是一个好主意：

  • 每当您需要绑定到variable. 这样，您可以强制数据在元素/页面/应用程序中流动的方向。
  • 只要您知道绑定必须是双向的，请使用{{variable}}。

根据文件，

为了使您的代码更易于阅读，您可能希望默认使用[[property]]形式，并且仅将{{property}}用于双向绑定。

然而，话虽如此，它最终归结为一个选择问题。如果您想放弃使用[[variable]]，没有人会阻止您，您也不会引发任何火灾。

于 2015-06-05T19:55:10.740 回答