Reactjs 当两件事发生变化时作出反应

我正在尝试使用react挂钩，我希望在两件事发生变化时运行一个函数：

const Filter = ({ orderList, orders }) => {
  const [from, setFrom] = useState();
  const [to, setTo] = useState();
  const [filteredList, setFilteredList] = useState(orders);

  useEffect(() => {
    const filteredOrders = orders.filter(function(item) {
      return item.order_number >= from && item.order_number <= to;
    });
    setFilteredList(filteredOrders);
    console.log(filteredList);
  }, [from, to]);

const Filter=（{orderList，orders}）=>{
const[from，setFrom]=useState（）；
const[to，setTo]=useState（）；
常量[filteredList，setFilteredList]=useState（订单）；
useffect（（）=>{
const filteredOrders=orders.filter（函数（项）{
return item.order\u number>=from&&item.order\u number您无法通过将更多参数传入
useffect（）
来完成此操作，默认情况下，只要更改一个项目，就会导致执行
useffect（）

但是，您可以将
useffect
与
useRef
组合以实现此目的。我们将使用
useRef
存储以前的状态值，并将其与新的状态值进行比较

例如，请参见codesandbox：

const-App=（）=>{
const[from，setFrom]=useState（）；
const[to，setTo]=useState（）；
const previousValues=useRef（{from，to}）；
useffect（（）=>{
如果(
previousValues.current.from！==from&&
previousValues.current.to！==to
) {
//你的逻辑在这里
console.log（“两者都已更改”）
previousValues.current={from，to}；
}
});
返回(
setFrom（e.target.value）}
/>
setTo（e.target.value）}
/>
);
};
为什么不添加一个
过滤器
按钮，并在单击按钮时处理过滤？如果没有按钮，当用户需要更改这两个按钮以查看更新的效果时，会非常混乱。有了按钮，如果用户只需更改1个值即可触发过滤，也有可能
const App = () => {
  const [from, setFrom] = useState();
  const [to, setTo] = useState();

  const previousValues = useRef({ from, to });

  useEffect(() => {
    if (
      previousValues.current.from !== from &&
      previousValues.current.to !== to
    ) {
      //your logic here
      console.log("both changed")
      previousValues.current = { from, to };
    }
  });

  return (
    <div>
      <input
        placeholder="from"
        value={from}
        onChange={e => setFrom(e.target.value)}
      />
      <input
        placeholder="to"
        value={to}
        onChange={e => setTo(e.target.value)}
      />
    </div>
  );
};