React useEffect如何用单个操作运行一个或多个函数

Question

С有人能帮我吗？，我已经解决这个问题一周了

我的应用程序仅在以下情况下工作：(3步(

我按下按钮(按钮、复选框、单选框(更改listYear、listMonth&listBranch(来自其他组件(

然后我需要按下按钮1来setFilterYDate(listYear(setFilterMDate(listMonth(>setFilterBranch(listBranch(

然后我需要按下按钮2来执行功能过滤器，该过滤器需要从按钮1 接收到的所有数据

我想要的是：(仅限1步(

当我按下按钮更改listYear、listMonth&listBranch，我不需要再按按钮1和2，它会自动启动。

function content() {
const dispatch = useDispatch()
let listYear = useSelector (state=>state.cardReducer.listYear)
let listMonth= useSelector (state=>state.cardReducer.listMonth)
let listBranch= useSelector (state=>state.cardReducer.listBranch)
let originalData = useSelector(state=>state.cardReducer.originalData)
const[meter,setMeter]=useState([])
const[tableRow,setTableRow]=useState([])
const[tableRow1,setTableRow1]=useState([])
const[filterYDate,setFilterYDate]=useState([listYear])
const[filterMDate,setFilterMDate]=useState([listMonth])
const[filterBranch,setFilterBranch]=useState([listBranch])
useEffect(()=>{
dispatch(getApi())
},[])
function filtered() {
*this function will change tableRow & tableRow1*
}
function onButton1() {
*this function will change all data required in function filtered*
setFilterYDate([listYear])
setFilterMDate(listMonth)
setFilterBranch(listBranch)
}
function onButton2() {
*this function run the filtered()*
filtered()
}
}

Answer 1

当listYear、listMonth或listBranch中的任何一个发生更改时，您都可以运行效果：

const filtered = useCallback(() => {
//if statement checking listYear,listMonth,listBranch
//dispatch action
}, [listBranch, listMonth, listYear]);
useEffect(() => filtered(), [filtered]);

如果filtered没有调度操作，而是设置了本地状态，则可以使用回调来防止循环依赖：

const [someState, setSomeState] = useState([]);
const filtered = useCallback(
() =>
setSomeState((someState) => {
//if statement checking listYear,listMonth,listBranch
//return someState.filter
//or return someState
}),
[listBranch, listMonth, listYear]
);
useEffect(() => filtered(), [filtered]);

但是，如果过滤后的数据是originalData的本地过滤版本，那么您应该使用选择器，我建议使用重新选择