Javascript 轻松的状态管理-如何正确获取和传递数据？

我正在使用Easy Peasy状态管理进行React。我想从一个存储位置创建多个Axios调用，并将其导入需要显示正确数据的每个页面。例如，我试图获取一个JSON占位符数据，并在组件中使用它，使用钩子将其推送到状态

但我得到了以下错误：

model.js:14 Uncaught (in promise) TypeError: actions.setTodos is not a function
    at model.js:14

有人能帮我吗？我做错了什么

我的商店代码（model.js）：

我的页面组件联系人：

import React, { useState, useEffect } from 'react';

import { useStoreActions } from 'easy-peasy';

import ReactHtmlParser from 'react-html-parser';

import { API_URL } from 'constants/import';

// import axios from 'axios';

const Contact = () => {
    const [contactPage, setContactPage] = useState([]);

    const { page_title, page_content, page_featured_image } = contactPage;

    const fetchTodos = useStoreActions(actions => actions.fetchTodos);

    useEffect(() => {
        fetchTodos();
    }, []);

    return (
        <section className="contact">
            <div className="page">
                <div className="row">
                    <div className="col-xs-12">
                        <h3 className="section__title">{page_title}</h3>
                        {ReactHtmlParser(page_content)}
                        {page_featured_image && (
                            <img src={API_URL + page_featured_image.path} />
                        )}
                    </div>
                </div>
            </div>
        </section>
    );
};

export default Contact;

import React，{useState，useffect}来自“React”；
从“easy peasy”导入{useStoreActions}；
从“react html parser”导入ReactHtmlParser；
从“常量/导入”导入{API_URL}；
//从“axios”导入axios；
常量联系人=（）=>{
const[contactPage，setContactPage]=useState（[]）；
const{page_title，page_content，page_featured_image}=contactPage；
const fetchTodos=useStoreActions（actions=>actions.fetchTodos）；
useffect（（）=>{
fetchTodos（）；
}, []);
返回(
{页眉}
{reactHTMLPasser（页面内容）}
{页面特色图片&&(
)}
);
};
导出默认联系人；

您需要使用操作

import { action, thunk } from "easy-peasy";

export default {
    fetchTodos: thunk(async (actions, payload) => {
        const res = await fetch(
            "https://jsonplaceholder.typicode.com/todos?_limit=10"
        );
        const todos = res.json();

        actions.setTodos(todos);
    }),

    
    todos: [],
    setTodos: action((state, payload) => {
        console.log("---->>> payload!")
        state.todos = payload
    }),

};

---

我通常这样使用它，它对我来说非常适合。

setTodos

definition？@xadm你是什么意思？我遗漏了什么吗？应该在某个地方定义？f、 e.商店内？您必须使用easy peasy为您提供的操作功能向您的商店添加一个名为setTodos的操作。

import { action, thunk } from "easy-peasy";

export default {
    fetchTodos: thunk(async (actions, payload) => {
        const res = await fetch(
            "https://jsonplaceholder.typicode.com/todos?_limit=10"
        );
        const todos = res.json();

        actions.setTodos(todos);
    }),

    
    todos: [],
    setTodos: action((state, payload) => {
        console.log("---->>> payload!")
        state.todos = payload
    }),

};