您可以使用 useRef 钩子和 useEffect 钩子的依赖项数组来实现只在初次渲染执行 levelInfo，并在参数变化时再次执行。以下是一个示例：
父组件:
import React, { useState } from 'react';
import { Tabs } from 'antd';
import AmenityLabels from './AmenityLabels';
const ParentComponent = () => {
const [activeTab, setActiveTab] = useState('default');
const hotelNewTagInfo = [
{ name: '标签1', code: 'code1' },
{ name: '标签2', code: 'code2' },
// 其他标签...
];
return (
<Tabs defaultActiveKey={activeTab} onChange={setActiveTab}>
{hotelNewTagInfo.map((item) => (
<Tabs.TabPane tab={item.name} key={item.code}>
<AmenityLabels tabsTitle="服务设施标签" tabsCode={item.code} />
</Tabs.TabPane>
))}
</Tabs>
);
};
export default ParentComponent;
子组件:
import React, { useEffect, useRef } from 'react';
const AmenityLabels = (props) => {
const firstRenderRef = useRef(true);
useEffect(() => {
if (firstRenderRef.current) {
firstRenderRef.current = false;
} else {
levelInfo(props.tabsCode);
}
}, [props.tabsCode]);
const levelInfo = (tabsCode) => {
// 在这里处理 levelInfo 函数逻辑
console.log('levelInfo 被执行', tabsCode);
};
return <div>Amenity Labels</div>;
};
export default AmenityLabels;
这样，当您的子组件接收到新的 tabsCode 参数时，levelInfo 函数会被执行，而在初次渲染时不会执行。
内容由零声教学AI助手提供，问题来源于学员提问
checkBox->setStyleSheet("QCheckBox::indicator:checked { background..." />
