浅色示例中“ $ =“或“？=”的目的

Question

我无法理解如何使用.class或?=这两个示例：

第一个示例：Lit-Element README

$=

第二个示例：PWA Example App

<div id="box" class$="${this.uppercase ? 'uppercase' : ''}">
  <slot>Hello World</slot>
</div>

为什么这些HTML属性后缀为<div class="decorator" focused?="${_focused}"> <slot id="inputSlot" name="input"></slot> <div class="underline"></div> </div> 或$？

Answer 1

$和?后缀似乎是不带前缀（属性值绑定）和?前缀（boolean attribute binding）的不赞成使用的版本，the source

  

要设置属性而不是属性，请在属性名称后附加一个$后缀。

     

示例：

html`<button class$="primary">Buy Now</button>`

     

⋮

     

@deprecated请改用/lit-html.js。扩展版本将在以后的版本中删除。

所以您现在要这个：

<div id="box" class="${this.uppercase ? 'uppercase' : ''}">
  <slot>Hello World</slot>
</div>

<div class="decorator" ?focused="${_focused}">
  <slot id="inputSlot" name="input"></slot>
  <div class="underline"></div>
</div>

”课程，如果留下了那些不赞成使用的内容，谁知道他们其他上下文的相关性。