只有当我们使用Recat Hooks单击按钮两次而不是一次时，状态才会更新。

Question

1. 我单击按钮时只需要显示最高值。但是在这里，只有当我们单击该按钮两次而不是一次时，状态才会被更新。
2. ，我们可以使用ES6特性(比如filter方法)来做吗？在这里，我使用了一个for循环：

const [dataObject, setdataObject] = useState([{}]);
const [filterData, setfilterData] = useState({});

const showMillions = () => {
  // //console.log(dataObject);
  let x = 0;
  let name = '';
  for (let i = 0; i < dataObject.length; i++) {
    // console.log(dataObject);
    if (dataObject[i].money > x) {
      x = dataObject[i].money;
      name = dataObject[i].name;
    }
  }
  setfilterData(name);
  for (let i = 0; i < dataObject.length; i++) {
    if (filterData === dataObject[i].name) {
      setdataObject([dataObject[i]]);
    }
  }
};
<div><button className="btn btn-dark" onClick={showMillions} >Show Millionaires</button></div>

Answer 1

您必须单击该按钮两次，因为setfilterData(name)是异步的。您可以在最后一个for循环中使用useEffect或使用name而不是filterData。

const [dataObject, setdataObject] = useState([{}]);
const [filterData, setfilterData] = useState({});

useEffect(() => {
    // using filter
    setDataObject(dataObject.filter((item) => item.name === filterData));
}, [filterData]);

const showMillions = () => {
    // //console.log(dataObject);
    let x = 0;
    let name = '';

    for (let i = 0; i < dataObject.length; i++) {
        // console.log(dataObject);
        if (dataObject[i].money > x) {
             x = dataObject[i].money;
             name = dataObject[i].name;
        }
    }
    setfilterData(name);
  }
};
<div><button className="btn btn-dark" onClick={showMillions} >Show Millionaires</button></div>