小编典典

AMP:切换CSS类的简单方法?

css

我正在构建加速移动页面(AMP)模板,并且想知道是否有一种简便的方法可以切换选项卡上的CSS类。

我知道类似的东西:

<h2 
  class="headline"
  on="tap:list.toggleVisibility"
>
<ul id="list"></ul>

但这写的是内联样式-我宁愿切换自定义CSS类,但在AMP页面上找不到示例。

AMP.setState与绑定<h2 [class]="myclasses">看起来像是要走的路,但是使用它们给您的工具来操纵状态非常困难…


阅读 339

收藏
2020-05-16

共1个答案

小编典典

这可以通过完成amp-bind。您可以使用隐式状态变量(例如visible)来跟踪当前状态。这是切换两个类show和的示例hide

  <button [text]="visible ? 'Show Less' : 'Show More'" 
           on="tap:AMP.setState({visible: !visible})">
    Show More
  </button>
  <p [class]="visible ? 'show' : 'hide'" class="hide">
    Some more content.
  </p>
2020-05-16