Question

我正在尝试使用下一个代码设置纸张按钮

在html文件中：

<template>
...
  <paper-button id="button1" toggle active="{{buttonsActive}}">button 1</paper-button>
  <paper-button id="button2" toggle active="{{buttonsActive}}">button 2</paper-button>
</template>

并在dart文件中：

@observable bool buttonsActive = false;

如果我在开始时按下按钮1，则将按钮2更改为活动/非活动状态。但是，如果我稍后按下按钮2，则在按下按钮1后，按钮1不会更改活动状态。如果我先按下按钮2，则会以相反的方式发生。

这是纸张按钮上的错误还是有办法正确地执行此操作？

Answer 1

我找到了解决方法。

添加下一个buttonsActiveListener：

buttonsActiveChanged(bool oldValue, bool newValue) {
    ($['button1'] as PaperButton).jsElement['lastEvent'] = null;
    ($['button2'] as PaperButton).jsElement['lastEvent'] = null;
  }

以前的代码会在每次lastEvetn变量更改时使buttonsActive为空。

这是因为：

  activeChanged: function() {
    this.super();

    if (this.toggle && (!this.lastEvent || this.matches(':host-context([noink])'))) {
      this.toggleBackground();
    }
  },

出现在paper-button-base.html的第58行。重要的一行是if语句，用于检查lastEvent是否为false（null或undefined）。

这只是一种解决方法。

在Dart中设置paper_button的正确方法是什么？

1 个答案: