错误：useStoreState 中的错误：无法读取未定义的属性（正在读取“getState”）-easy-peasy答案

【问题标题】：Error: Error in useStoreState: Cannot read properties of undefined (reading 'getState') - easy-peasy错误：useStoreState 中的错误：无法读取未定义的属性（正在读取“getState”）-easy-peasy
【发布时间】：2021-11-15 16:08:04
【问题描述】：

在我的下一个 js 代码中使用 easy-peasy，我正在尝试存储一些值。但是当我尝试使用一些存储值时，我得到了标题错误。我该怎么办？

我的结构是：

我的代码是：

_app.js

import { StoreProvider } from 'easy-peasy';
import '../styles/globals.css';
import { store } from '../stores/Store';

function MyApp({ Component, pageProps }) {
    return (
        <StoreProvider store={store}>
            <Component {...pageProps} />
        </StoreProvider>
    );
}

export default MyApp;

Store.js

import { createStore } from 'easy-peasy';

const store = createStore({
    activeStep: 1,
    step1Answers: { name: '', resp: '' },
});

index.js

import Head from 'next/head';
import Image from 'next/image';
import styles from '../styles/Home.module.css';
import { useStoreState } from 'easy-peasy';

export default function Home() {
    const activeStep = useStoreState((state) => state.activeStep);

    console.log(activeStep);

    return (
        <div className={styles.container}>
            <h1>My active step: {activeStep}</h1>
        </div>
    );
}

【问题讨论】：

标签： reactjs next.js easy-peasy

【解决方案1】：

找到了...我需要在我的 _app.js 文件中添加我的商店

import { StoreProvider, createStore } from 'easy-peasy';
import '../styles/globals.css';

const store = createStore({
    activeStep: 1,
    step1Answers: { name: '', resp: '' },
});

function MyApp({ Component, pageProps }) {
    return (
        <StoreProvider store={store}>
            <Component {...pageProps} />
        </StoreProvider>
    );
}

export default MyApp;

【讨论】：