React多筛选功能异常：仅名称筛选正常，添加状态筛选失效

我在基于Rick and Morty API开发多筛选功能时碰到了问题：单独用名称筛选完全正常，但在同一个搜索字符串里加入状态（alive/dead）或性别（male/female/genderless）筛选时，功能直接失效。经过排查，找到了四个核心问题，对应的修复方案如下：

• useState异步更新导致无法获取最新filterName值
  连续调用setFilterName时，后续操作拿不到最新的filterName——这是因为useState的更新是异步批量处理的，直接读取state会拿到旧值。
  修复方法：改用useState的函数式更新，比如setFilterName(prevName => prevName + newKeyword)，确保每次更新都基于上一次的最新状态；或者把依赖filterName的逻辑放到useEffect里，监听filterName变化再执行后续操作。

• replaceAll无法彻底移除筛选关键词
  之前用replaceAll只替换单个字符，根本没法完整移除"alive"、"male"这类多字符的筛选关键词。
  修复方法：用正则表达式匹配完整的目标关键词，比如要移除状态关键词，可以写filterName.replace(/\b(alive|dead)\b/g, '')，\b确保匹配完整单词，g实现全局替换；如果有多个关键词，直接把它们放到正则的分组里即可。

• useEffect未正确重置filterPath
  之前在useEffect开头没有重置filterPath，导致每次更新筛选条件时，路径都会叠加旧的筛选参数，完全不符合预期。
  修复方法：在useEffect的最开始，把filterPath初始化为API的基础路径，比如let filterPath = '/api/character'，这样每次构建筛选路径都是从干净的起点开始。

• filterPath无法正确识别filterName中的筛选条件
  之前构建filterPath时，没有正确解析filterName里的名称、状态、性别关键词，导致拼接出的API请求路径完全错误。
  修复方法：先把filterName按空格拆分，然后分类识别关键词——比如判断某段字符串是状态（alive/dead）、性别（male/female/genderless）还是名称，再分别拼接成对应的查询参数，最后把所有参数用&连接到基础路径后，形成正确的请求路径，比如/api/character?name=Rick&status=alive&gender=male。

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