Polymer 1.0的tokenList样式发生了什么变化
在Polymer 0.5中,可以使用带有元素类属性表达式的tokenList过滤器来根据对象值有条件地应用类。 什么是v1.0替代或等效技术? 除了完全用代码处理它之外,我无法找到任何有关该主题的内容。
聚合物1.0为了提高性能而做了一些削减,表达式就是其中之一。
使用0.5文档中的示例:
<div class="{{ {active: user.selected, big: user.type == 'super'} | tokenList}}">
你可以重写1.0,如下所示:
<div class$="{{getClassList(user.selected, user.type)}}">
然后在你的元素的js中:
getClassList: function(selected, type) {
var classList = '';
if (selected) classList += ' active';
if (type == 'super') classList += 'big';
return classList;
}
确保任何可能发生变化的属性(以及取决于的结果值)都作为参数传递给函数。 如果这些属性更新,聚合物将重新计算该值。 还要确保传递给函数的每个属性都以某种方式初始化 - 如果任何参数undefined
Polymer将不会计算该属性。
另一件需要注意的事情是任何{{}}
必须占据整个属性或文本内容,因此您不能拥有诸如class="foo {{bar}}"
。 如果你需要声明性地为你的元素添加一个类名,你可以这样做:
<div class$="{{getClassList('user-item', user.selected, user.type)}}">
链接地址: http://www.djcxy.com/p/26699.html