Javascript 是否有一种简单的方法可以将e.target.name以外的所有其他状态设置为false？

真正的问题-我想点击链接。链接在那之后就不工作了-

<li className={this.state.selectedState === "jobs" ? "nav-item active" : "nav-item"}> <Link to = {{type: "JOBLIST", payload : { id : this.props.company_id, status : "active" }}} className="nav-link" name = "jobs" onClick ={this.onclick1}>JOBS</Link> </li>

这些是用于链接的，如果我单击其中任何一个，它将触发onclick1函数

<a href="#" name="a" onClick={this.onclick1} > a </a>
<a href="#" name="b" onClick={this.onclick1} > b </a>
<a href="#" name="c" onClick={this.onclick1} > c </a>
<a href="#" name="d" onClick={this.onclick1} > d </a>

---

我建议为此使用一些initialState变量。例如：

const initialState = {
  a: false,
  b: false,
  c: false,
  d: false,
};

class Component extends React.Component {
  constructor(props) {
    super(props);

    this.state = { ...initialState };
  }

  onClick(e) {
    this.setState({
      ...initialState,
      [e.target.name]: true,
    });
  }
}

---

因此，在单击处理程序中，您只需设置初始状态并仅将单个键的值设置为true，就可以执行以下操作：

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      selected: '',
    };
    this.links = { 'a': false, 'b': false, 'c': false, 'd': false },      
  }

  onclick = (e) => {
    e.preventDefault();
    console.log("name header" + e.target.name)
    this.links = {
      ...this.links,
      [`${this.state.selected}`]: false,
    };
    this.setState({
      selected: e.target.name,
    });
  }

  render() {
   return (
     <div>
       {
         Object.keys(this.links).map(key => {
           return <a href="#" name={key} onClick={this.onclick1} >{key} </a>
         });
       }
     </div>
   );
  }

}

类MyComponent扩展组件{
建造师（道具）{
超级（道具）；
此.state={
已选择：“”，
};
this.links={'a'：false，'b'：false，'c'：false，'d'：false}，
}
onclick=（e）=>{
e、 预防默认值（）；
console.log（“名称标题”+e.target.name）
此链接={
…此链接，
[`${this.state.selected}`]：false，
};
这是我的国家({
所选：e.target.name，
});
}
render（）{
返回(
{
Object.keys（this.links）.map（key=>{
返回
});
}
);
}
}

您可以只使用一个

selectedState

变量（例如

this.selectedState=“a”

），而不是使用多个

state

布尔值。之后我想做类似的事情。你可以这样做：

。谢谢你。太棒了。实际上这才是真正的问题。我要点击链接

jobs

链接在此之后不起作用。感谢您的帮助。

const initialState = {
  a: false,
  b: false,
  c: false,
  d: false,
};

class Component extends React.Component {
  constructor(props) {
    super(props);

    this.state = { ...initialState };
  }

  onClick(e) {
    this.setState({
      ...initialState,
      [e.target.name]: true,
    });
  }
}

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      selected: '',
    };
    this.links = { 'a': false, 'b': false, 'c': false, 'd': false },      
  }

  onclick = (e) => {
    e.preventDefault();
    console.log("name header" + e.target.name)
    this.links = {
      ...this.links,
      [`${this.state.selected}`]: false,
    };
    this.setState({
      selected: e.target.name,
    });
  }

  render() {
   return (
     <div>
       {
         Object.keys(this.links).map(key => {
           return <a href="#" name={key} onClick={this.onclick1} >{key} </a>
         });
       }
     </div>
   );
  }

}