根据你提供的代码,子组件中的labelDefinitionsList
代码会在每次父组件的props变化时执行。这是因为你在useEffect
的依赖项中包含了props.tabsTitle
、props.tabsCode
和lastTwoLevelCode
,只要这些值有任何一个发生变化,就会触发子组件中的效果函数。
如果你想要避免重复执行多次,可以考虑添加额外的条件来限制执行次数。例如,在子组件中使用状态来记录上一次执行的参数,并在新参数与旧参数不同时才调用labelDefinitionsList
函数。下面是一个示例:
const [prevProps, setPrevProps] = useState({});
useEffect(() => {
if (
(props.tabsTitle === '认证标签' || props.tabsTitle === '会员权益标签') &&
(prevProps.tabsTitle !== props.tabsTitle || prevProps.tabsCode !== props.tabsCode)
) {
labelDefinitionsList(props.tabsCode, '', current, pageSize);
} else if (
(prevProps.lastTwoLevelCode !== lastTwoLevelCode || prevProps.tabsCode !== props.tabsCode)
) {
labelDefinitionsList(props.tabsCode, lastTwoLevelCode, current, pageSize);
}
setPrevProps({
tabsTitle: props.tabsTitle,
tabsCode: props.tabsCode,
lastTwoLevelCode: lastTwoLevelCode
});
}, [props, lastTwoLevelCode]);
通过使用状态来存储前一次的属性值并进行比较,可以有效地控制labelDefinitionsList
的执行次数。请根据实际需求进行适当调整和修改。
内容由零声教学AI助手提供,问题来源于学员提问