主页 / 问题 / 1508595
Accepted
Zhihar
Asked:2023-03-27 23:56:04 +0800 CST2023-03-27 23:56:04 +0800 CST

反应：如何在功能组件中理解属性值已更改

  • 772

有一个功能性的 React 组件Header：

const Header = (props) => {
    [value, setValue] = useState(() => {
        console.log('создание компонента');
        return props.attr;
    });

    return <div>{value}</div>

是这样称呼的：

<Header attr={attr} />

据我了解，Header在创建此组件时，useState 只会被调用一次。如果值发生变化，attr则不会进行重复调用（毕竟，组件保持在原位）

告诉我，在组件内部Header你如何理解属性已经改变（即新 props 与旧 props 不同）并执行一些与渲染无关的操作（处理数据等）？

那些。所有逻辑都应该只在组件内部Header，只有属性发生变化，仅此而已。

javascript

1 个回答

  1. Best Answer

    为此，您需要使用useEffect 文档

    const Header = (props) => {
    [value, setValue] = useState(() => {
        console.log('создание компонента');
        return props.attr;
    });

    useEffect(() => {
        console.log('new props');
    }, [props.attr]);
    
    return <div>{value}</div>
    }

    • 1

相关问题