Question

useState()给我未定义的新状态变量（通知）：

const Notifications = (props) => {
    const [notifications, setNotifications] = useState(props.notifications);//notifications = undefined, props = {notifications: Array(0)}
    useEffect(() => {
        if (props.notifications) {
        setNotifications(props.notifications);
        }
    }, [props.notifications]);
    // do stuff....

我希望通知为[]，然后在setNotifications()更改时使用props.notifications更新通知。 props.notification来自Redux商店。我不知道这是否会改变任何东西，但我确实设置了初始状态。

const initialState = Immutable.fromJS({
  notifications: [],
});

不知道为什么我变得不确定...

编辑：消除了打字错误和测试代码

Answer 1

要正确设置初始状态，您应该将其作为参数传递给useState，因此：

const [notifications, setNotifications] = useState([]);

无论您是否将props.notifications设置在某个地方之外，但如果您依靠它在组件中具有某种默认值，那么就应该在此设置它，例如：

const Notifications = ({ notifications = [] }) => {

最后（但并非最不重要），在useEffect的依赖项列表中使用数组会产生一些不良影响，例如，如果notifications的结构性保持不变（相同的项目，相同的长度），但将是一个新数组，useEffect将丢失高速缓存，因为它仅进行浅层比较。考虑使用某种哈希函数代替数组本身（例如JSON.stringify）

React Hook的新用法useState返回未定义

1 个答案: