擦除角色会产生错误

2 年前

我的小实验的目标很简单：过滤/搜索名称与输入文本字段中键入的当前值匹配的用户 . 为了实现这样的功能，我使用 RegExp() . 一切都很好，除非我擦掉一个角色;这样做会使过滤停止 .

在构造函数中：

state = { users: [] }

事件：

searchUser = e => {
  const target = e.target;

  this.setState(state => {
    const regex = new RegExp(target.value, 'i');
    const filteredUsers = state.users.filter(user => regex.test(user.name));

    return { users: filteredUsers }
  })
}

里面 render() ：

<input type='text' onChange={this.searchUser} />

是因为 setState() 是异步的吗？

提取用户列表是在 componentDidMount() 内使用 fetch() 和 async/await 完成的 .

javascriptreactjs

1回答

4
1 年前
我认为你在打字时是有效的，只是用一个更窄更窄的参数进行过滤 . 擦除时， state.users 已经变异，只包含以前过滤的用户，看起来它停止工作 .

要解决这个问题，请更改

const filteredUsers = state.users.filter(user => regex.test(user.name));

喜欢的东西

const filteredUsers = allUsers.filter(user => regex.test(user.name));

暂时没有评论！

擦除角色会产生错误

相关问题