Question

我有一个导航组件，其中活动元素获得不同的颜色。但也应该能够打开/关闭活动元素。

所以我为每个导航元素创建了一个函数，用于设置它自己的＆＃34;导航元素为true（或false），所有其他值为false：

public toggleHomeX() {
    if (this.toggleHome) {
        this.toggleHome = !this.toggleHome;
    } else {
        this.toggleHome = !this.toggleHome;
        this.toggleContact = false;
        this.toggleAbout = false;
        this.toggleOther = false;
    }
}

public toggleContactX() {
    if (this.toggleContact) {
        this.toggleContact = !this.toggleContact;
    } else {
        this.toggleContact = !this.toggleContact;
        this.toggleHome = false;
        this.toggleOther = false;
        this.toggleAbout = false;
    }
}

https://plnkr.co/edit/LURJUXhAudSdQnMdzcOo?p=preview

这当然有效，但它会产生一些可怕的代码。我怎样才能抽象出函数，以便简化这段代码呢？

Answer 1

试试这个，你只需要定义一个函数和一个变量，代码就会更清晰。

this.toggleValue = "";
public toggleX(value) {
      this.toggleValue = value;

jsfiddle

在菜单按钮和切换按钮之间切换

1 个答案: