切换路由时React State为空，状态未更新原因咨询

咱们先把你代码里的几个关键问题拆解出来，这就是导致state更新异常和路径判断问题的根源：

1. State字段名不匹配（最核心的笔误） #

你在构造函数里初始化的state字段是setMenu：

this.state = { 
  setMenu: (window.location.pathname.split("/")[1] == '') ? '/' : window.location.pathname.split("/")[1] 
};

但后续更新state和判断激活状态时，用的却是setarMenu：

// 更新state时用setarMenu
setMenu = (event) => { this.setState({setarMenu: event.target.title}); };

// 判断激活时用this.state.setarMenu
className={(this.state.setarMenu === item.title) ? 'active' : ''}

这就导致初始的state字段和后续操作的字段完全是两个东西，自然会出现"state没更新"的假象——实际上你更新的是另一个不存在的字段，而判断激活时读的也是未初始化的setarMenu（默认是undefined）。

2. window.location.pathname的解析逻辑漏洞 #

正常情况下浏览器的window.location.pathname不会是空字符串，最少是"/"。但当路径是根路径"/"时，split("/")会得到数组["", ""]，所以split("/")[1]确实是空字符串，你的三元表达式把state设为"/"是没问题的，但如果是在React Router还未完成初始化的时机（比如组件构造函数执行时，路由还没同步好），可能会出现路径获取不准确的情况。

另外，你的解析逻辑只取了路径的第一级，比如路径是"/dashboard/settings"，会得到"dashboard"，这可能符合你的需求，但要注意如果路径是多级的情况。

3. 点击事件的event.target指向错误 #

你的NavLink里面嵌套了<span>标签，当用户点击文字的时候，event.target实际上指向的是<span>而不是外层的NavLink，而<span>没有title属性，所以event.target.title会是空字符串，导致你setState的时候把setarMenu设成了空，看起来像是state没更新。

修复后的完整代码示例 #

第一步：统一state字段名+优化路径解析 #

把所有相关的字段名改成一致的（比如语义更清晰的activeMenuTitle），同时优化路径解析逻辑，避免split的空值问题：

constructor(props) {
  super(props);
  // 过滤掉split后产生的空字符串
  const pathSegments = window.location.pathname.split("/").filter(seg => seg);
  const initialActiveMenu = pathSegments.length > 0 ? pathSegments[0] : '/';
  this.state = { 
    activeMenuTitle: initialActiveMenu
  };
  this.menuItens = new Menu().Itens;
}

第二步：修复点击事件的target问题 #

用event.currentTarget代替event.target，currentTarget永远指向绑定事件的元素（也就是NavLink），不管点击的是子元素：

setMenu = (event) => {
  // 用currentTarget获取绑定事件的NavLink元素的title
  this.setState({ activeMenuTitle: event.currentTarget.title });
};

第三步：修正激活状态判断 #

<NavLink 
  tag={Link} 
  to={item.path} 
  title={item.title} 
  onClick={this.setMenu} 
  className={(this.state.activeMenuTitle === item.title) ? 'active' : ''}
>
  <span>{item.nome}</span>
</NavLink>

额外优化建议 #

如果你的项目用了React Router，建议不要直接操作window.location，而是用useLocation钩子（函数组件）或者props.location（类组件需用withRouter包裹）来获取当前路径，这样更符合React Router的生命周期，避免初始加载时路径不一致的问题。

内容的提问来源于stack exchange，提问作者lianbwl