LitElement - 如果值为 false，则不要添加属性

Question

有没有办法基本上呈现这三种可能性：<my-el someValue="a"></my-el><my-el someValue="b"></my-el><my-el></my-el> 请注意第三个明显缺少该属性someValue。要正常渲染，我会这样做：render() {  const someValue = "a";  return html`    <my-el someValue=${someValue}></my-el>  `;}但如果someValue是undefined，它会呈现为<my-el someValue="undefined"></my-el>我不想要的。有没有办法为虚假获得类似布尔的行为，但显示真实值的价值？我阅读了文档，但希望我遗漏了一些东西。我想这样做的原因是因为我想要一个 CSS 选择器，它会影响所有这些选择器，[someValue]而不管实际值是什么，但如果它不存在则不应用它。PS，我知道使用:not([someValue=undefined])或返回条件 HTML 之类的解决方法，所以请不要回复这些。我现在正在使用其中的一个，但是如果我的问题有直接的答案，希望换掉它以获得更简洁的代码。谢谢。

Answer 1

您可以简单地ifDefined为此使用指令。对于 AttributeParts，如果 已定义，则设置属性，如果someValue未定义，则删除属性someValue。然后，您可以使用三元运算符进一步修改它以检查虚假值：

import {ifDefined} from 'lit-html/directives/if-defined';

return html`

   <my-el someValue=${ifDefined(someValue ? someValue : undefined)}></my-el>

`;