错误:useStoreState中的错误:无法读取未定义的属性(读取'getState') - easy-peasy

Question

在我的下一个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>
    );
}

Answer 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;