如果输入字符串有空格，则阻止状态更新

Question

我的代码下面有什么问题？基本上我不希望在用户在开头或结尾输入额外空格时更新我的​​状态。

handleSearchQuery = (e) = {
  if(e.target.value.trim() != "") {
    this.setState({
      q: e.target.value
    });
  }
}

Answer 1

第一个错误似乎是您忘记了箭头功能中的>。将第一行更改为：

handleSearchQuery = (e) => {

无论如何，这就是我写整个函数的方式：

handleSearchQuery = (e) => {
  let str = e.target.value.trim();
  if(str != this.state.q) {
    this.setState({
      q: str
    });
  }
}

将修剪后的输入与现有状态q进行比较。如果他们是平等的，没有任何反应。否则，请更新状态。

我将字符串的修剪结果存储在一个变量中，否则我需要trim()两次......无论那个价值多少。

Answer 2

handleSearchQuery = (e) => {
  if(e.target.value.trim() != this.state.q) {
    this.setState({
      q: e.target.value
    });
  }
}