使用 Polymer 在两个 div 之间切换

Question

我运行遇到一个使用聚合物的问题，我想通过两个 div 切换，我遇到的问题是，我想在他们使用的地方使用切换聚合物标准： hidden?="{{toggleMe}}" 作为 div 上的一个属性，只需绑定它，然后创建一个函数来执行切换或 show/hide，如下所示：

<div hidden?="{{divOne}}">TEST</div>
<div hidden?="{{divTwo}}">TEST2</div>

<a on-tap="{{change}}">Toggle</a>

<script>
Polymer('componentName',{
  change: function(){
   this.divOne = !this.divOne;
   this.divTwo = !this.divTwo;
  }
})
</script>

以上将同时显示和隐藏两者，我想要一个显示另一个隐藏，所以本质上是在两者之间切换，从一个隐藏另一个激活开始，然后从那里交换状态。

我也试过了，但没有成功，因为我不能这样做，也不能使用 '!'在左侧：

!this.divOne = this.divOne;
this.divTwo = !this.divTwo;

感谢阅读

Answer 1

this.divOne = !(this.divTwo = this.divOne);

Answer 2

我找到了问题的解决方法，我在使用它们之前为绑定隐藏值分配了 true 和 false 值（这为隐藏状态分配了 true，为单独的值分配了 false），然后当单击切换绑定我只是使用@Zikes 的代码来进行切换（感谢）。

当前工作代码

<div hidden?="{{divOne}}">TEST</div>
<div hidden?="{{divTwo}}">TEST2</div>

<a on-tap="{{change}}">Toggle</a>

<script>
Polymer('componentName',{
  divOne: false,
  divTwo:true,
  change: function(){
   this.divOne = !(this.divTwo = this.divOne);
  }
})
</script>

希望这可以帮助将来清除某人

使用 Polymer 在两个 div 之间切换

Toggling between two divs using Polymer

html

javascript

web-component

polymer