Question

我试图以这种方式将属性传递给Polymer组件：

＆＃13;

<sample-button is-connected="[[profileData.isConnected]]"></sample-button>

＆＃13;

当profileData.isConnected=true我想在sample-button中使属性isConnected在附加方法中设置为true时。为什么聚合物中没有变化？我应该触发事件并再次调用方法返回profileData.isConnected吗？

在我的示例按钮组件中：

＆＃13;

<dom-module id="sample-button">
	<template>
      <another-button>
        Some text here
      </another-button>
	</template>
	<script>
      Polymer({
        is: 'sample-button',
        
        properties: {
          isConnected: {
            type: Boolean,
            value: false,
            observer: 'updateData'
          }
        },
        updateData: function (isConnected) {
          //some code here when isConnected has been changed
        },
        attached: function() {
          //I want to make isConnected set to true when attribute is-connected="true"
        }
      });
  </script>
</dom-module>

＆＃13;

Answer 1

要使示例按钮的'isConnected'属性跟随其父级的'profileData.isConnected'，我认为最快的方法是在属性名称的末尾添加'$'

<sample-button is-connected$="[[profileData.isConnected]]"></sample-button>

这是因为在html中，boolean html属性如果存在则为true，否则为false（例如隐藏），所以只做

<sample-button is-connected="[[profileData.isConnected]]"></sample-button>

让它存在并始终如实。

使用'$'聚合物只会在真实的情况下添加它。

这样你的'isConnected'属性应该用好的值初始化，跟随它的父级中'profileData.isConnected'的变化，然后激活观察者。

您不需要“附加”回电。

将属性传递给Polymer

1 个答案: