redux中存储了数据，在另一个页面中获取需要先点击存储数据的页面才能获取数据？

需求：在reducer中存储了科目页面的‘subjectList’数据，需要在统计页面的下拉框进行获取使用，categorize为0时，是应收款的数据，categorize为1时，是应付款的数据。
问题：subjectList数据已经存储到了reducer中，但是每次在统计页面获取下拉框数据时，需要先点击科目页面之后，科目下拉框中才会出现数据。怎样才能够实现统计页面可以直接获取科目列表的数据呢？

页面展示：

项目代码：

reducer的处理如下：

actions处理如下：

科目页面处理如下：

统计页面处理如下：

因为科目页面和统计页面中都分为应付款和应收款，所以在存储数据时，就直接分开存储了，不知道这样有没有问题？

subjectList在科目页面中存储的，如果直接访问统计页面，那么不会显示科目数据。流程导致的，如果是先访问统计，获取不到数据，需要调用接口获取科目数据。

这里每次是指已经先访问过科目页面后，在打开统计页面也无法获取到subjectList？

以下内容部分参考ChatGPT模型：

问题描述：

在redux中存储了科目页面的‘subjectList’数据，需要在统计页面的下拉框进行获取使用，但是每次在统计页面获取下拉框数据时，需要先点击科目页面之后，科目下拉框中才会出现数据。如何实现统计页面可以直接获取科目列表的数据？

解决思路：

在科目页面加载时，同时向redux中存储数据。
在统计页面加载时，从redux中获取科目列表数据。
在科目页面或者统计页面修改科目列表时，同时更新redux中的数据。

代码实现：

在科目页面中，使用useEffect钩子函数，当页面加载完成后，向redux中存储科目列表数据。

import { useEffect } from 'react';
import { useDispatch } from 'react-redux';
import { setSubjectList } from './actions';

function SubjectPage() {
  const dispatch = useDispatch();

  useEffect(() => {
    const subjectList = [
      { id: 1, name: '科目1' },
      { id: 2, name: '科目2' },
      { id: 3, name: '科目3' },
    ];
    dispatch(setSubjectList(subjectList));
  }, [dispatch]);

  // ...
}

在统计页面中，使用useSelector钩子函数，从redux中获取科目列表数据，并渲染下拉框。

import { useSelector } from 'react-redux';

function StatisticPage() {
  const subjectList = useSelector((state: any) => state.subjectList);

  // ...

  return (
    <div>
      <select>
        {subjectList.map((subject: any) => (
          <option key={subject.id} value={subject.id}>
            {subject.name}
          </option>
        ))}
      </select>
    </div>
  );
}

在科目页面或者统计页面中修改科目列表时，同时更新redux中的数据。

import { useDispatch } from 'react-redux';
import { setSubjectList } from './actions';

function SubjectPage() {
  const dispatch = useDispatch();

  const handleAddSubject = () => {
    // 添加新的科目项
    const newSubjectList = [...subjectList, { id: 4, name: '科目4' }];
    // 更新redux中的数据
    dispatch(setSubjectList(newSubjectList));
  };

  // ...
}

import { useDispatch } from 'react-redux';
import { setSubjectList } from './actions';

function StatisticPage() {
  const dispatch = useDispatch();

  const handleDeleteSubject = (id: number) => {
    // 删除指定id的科目项
    const newSubjectList = subjectList.filter((subject: any) => subject.id !== id);
    // 更新redux中的数据
    dispatch(setSubjectList(newSubjectList));
  };

  // ...
}

如果我的建议对您有帮助、请点击采纳、祝您生活愉快

不知道你这个问题是否已经解决, 如果还没有解决的话:

这有个类似的问题, 你可以参考下: https://ask.csdn.net/questions/7526090

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！
PS：问答VIP年卡【限时加赠：IT技术图书免费领】，了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632