Polymer 包含多个组件实例的数据不一致
我正在使用mp slider(polymer 2.0),但需要标题作为链接。我添加了属性sliderLink(如下所示),除了所有实例的URL值都是最后一个实例的值之外,其他一切都正常工作。例如,如果我的链接是google.com/1 google.com/2 yahoo.com/1,则所有幻灯片上的链接都是yahoo.com/1 为了解决这个问题,我添加了一个值:function(){return[];},并尝试了几个版本的语法,结果没有任何变化 对我来说,奇怪的是,该属性有三种用途,一个实例具有正确的值,而另两个实例没有Polymer 包含多个组件实例的数据不一致,polymer,Polymer,我正在使用mp slider(polymer 2.0),但需要标题作为链接。我添加了属性sliderLink(如下所示),除了所有实例的URL值都是最后一个实例的值之外,其他一切都正常工作。例如,如果我的链接是google.com/1 google.com/2 yahoo.com/1,则所有幻灯片上的链接都是yahoo.com/1 为了解决这个问题,我添加了一个值:function(){return[];},并尝试了几个版本的语法,结果没有任何变化 对我来说,奇怪的是,该属性有三种用途,一个实例
#标题{
宽度:100%;
背景:var(--标题背景);
填充:5px20px;
位置:绝对位置;
底部:0;
框大小:边框框;
过渡:所有2s线性;
}
#标题h3,#标题p{color:var(--白色)}
#标题h3{
字体大小:20px;
利润率:10px0;
填充:0
}
#标题p{
字体大小:14px;
保证金:5px;
填充:5px0
}
{{sliderLink}}
{{滑块}}
{{sliderContent}
类mpc.Element{
静态get是(){
返回“mp标题”
}
静态获取属性(){
返回{
滑块:字符串,
幻灯片内容:字符串,
滑块链接:{String,value:function(){return[];}},
}
}
}
customElements.define(mpCaption.is,mpCaption);
尝试绑定到href属性而不是属性:
<a href$={{sliderLink}}>
正如凯特·杰弗里斯(Kate Jeffreys)告诉您应该使用属性绑定时所说的那样:
<a href$="{{sliderLink}}"></a>
我不知道你是如何传递每个属性的值的,但是你的例子没有任何问题
我不得不删除position:absolute,这样我就可以看到每个标题,而不必一个接一个地看
我更改的另一件事是属性sliderLink,您返回了一个空数组,但在String类型的属性中没有意义
在这里您可以看到代码:
在这里您可以查看演示:在这个例子中,我从{{sliderLink}得到两个不同的结果。a标记显示的文本在屏幕上实际上与源代码不同。在任何未使用链接的屏幕上,正确显示值,但代码的值错误。