Polymer 如何基于lit元素中的属性添加类?

Polymer 如何基于lit元素中的属性添加类?,polymer,web-component,lit-element,Polymer,Web Component,Lit Element,如何使用web组件属性添加条件类?假设我有一个获取属性fullscreen的图像组件,然后我想将类fullscreen添加到我的组件中(使用lit元素) 我现在拥有的(不工作) 导出类图像扩展LitElement{ 静态获取样式(){ 返回css` :主持人{ 显示:块; 身高:100%; } 图画{ 显示:块; } .全屏图像{ 位置:绝对位置; 对象匹配:覆盖; 左:0; 右:0; 排名:0; 底部:0; 身高:100%; 宽度:100%; z指数:-2; } `; } 静态获取属性(){

如何使用web组件属性添加条件类?假设我有一个获取属性fullscreen的图像组件,然后我想将类fullscreen添加到我的组件中(使用lit元素)

我现在拥有的(不工作)

导出类图像扩展LitElement{
静态获取样式(){
返回css`
:主持人{
显示:块;
身高:100%;
}
图画{
显示:块;
}
.全屏图像{
位置:绝对位置;
对象匹配:覆盖;
左:0;
右:0;
排名:0;
底部:0;
身高:100%;
宽度:100%;
z指数:-2;
}
`;
}
静态获取属性(){
返回{
全屏:{
类型:布尔型
},
imageSrc:{
类型:字符串
}
};
}
构造函数(){
超级();
this.fullScreenClass={
全屏:这是全屏
}
this.imageSrc=“”;
}
render(){
返回html`
`;
}
}

我想如何使用它

<test-image fullscreen
  imageSrc="https://www.driving.co.uk/s3/st-driving-prod/uploads/2019/05/Aston-Martin-Rapide-E-Charging-01.jpg">
</test-image>
<test-image fullscreen
  imageSrc="https://www.driving.co.uk/s3/st-driving-prod/uploads/2019/05/Aston-Martin-Rapide-E-Charging-01.jpg">
</test-image>

您可以使用属性css选择器

:host([fullscreen]) {
    // your styling for fullscreen
  }
此样式将应用于HTML中的以下组件实例,因为
fullscreen
属性


您可以使用属性css选择器

:host([fullscreen]) {
    // your styling for fullscreen
  }
此样式将应用于HTML中的以下组件实例,因为
fullscreen
属性