如何使用 react hook 和 redux 在 useState 中设置数组答案

【问题标题】：How to set the array inside useState using react hook and redux如何使用 react hook 和 redux 在 useState 中设置数组
【发布时间】：2021-09-05 02:27:21
【问题描述】：

我在将不同的列表项从 redux 状态放入 UseState 时遇到问题，我使用 react-redux 的 useSelector 来获取我的 redux 上的状态，当我控制台记录状态时会发生这种情况，useSelector 值的数组为 0 但是当我控制台记录选择器有数据。

还原：

useEffect(() => {
    dispatch(fetchBanks())
    dispatch(fetchRemarks())
    dispatch(fetchBankAccounts())
    dispatch(fetchCustomerPayor())
}, [fetchBanks,fetchRemarks,fetchBankAccounts,fetchCustomerPayor])



const list_bank =  useSelector((state) => state.receive_checks.list_banks.data);
const list_remarks =  useSelector((state) => state.receive_checks.list_remarks.data);
const list_bank_accounts =  useSelector((state) => state.receive_checks.list_bank_accounts.data);
const list_customer_payor =  useSelector((state) => state.receive_checks.list_customer_payor.data);

设置状态：

console.log(list_bank,"start");


const defaultArray = [
    {
        key:"0",
        customer:list_customer_payor,
        bank:list_bank,
        branch:"",
        checkNo:"",
        amount:"",
        remarks:list_remarks,
        checkDate:""
    },
    {
        key:"1",
        customer:list_customer_payor,
        bank:list_bank,
        branch:"",
        checkNo:"",
        amount:"",
        remarks:list_remarks,
        checkDate:""
    },
    {
        key:"2",
        customer:list_customer_payor,
        bank:list_bank,
        branch:"",
        checkNo:"",
        amount:"",
        remarks:list_remarks,
        checkDate:""
    },
    {
        key:"3",
        customer:list_customer_payor,
        bank:list_bank,
        branch:"",
        checkNo:"",
        amount:"",
        remarks:list_remarks,
        checkDate:""
    },
    {
        key:"4",
        customer:list_customer_payor,
        bank:list_bank,
        branch:"",
        checkNo:"",
        amount:"",
        remarks:list_remarks,
        checkDate:""
    }
];

console.log(defaultArray,"test");

const [data, setData] = useState(defaultArray) 

console.log(data,"end");

状态输出没有数据：

【问题讨论】：

调度了哪些操作以及它们如何更改状态（redux devtool 输出和 reducer 代码）？您是否尝试使用尚未设置的 redux 状态设置本地状态？你在 reducer 中改变状态吗？
我要解释的是。我的 redux 上已经有状态列表（list_customer_payor、list_bank、list_remarks）。现在这个状态列表，我想把它放在我的 defaultArray 中。现在我已经在我的对象（客户、银行、备注）上声明了它。然后这个 defaultArray 我想把它放在我的本地状态。当我尝试控制本地状态数据时，这里的问题是放置的数据列表没有价值。
在这种情况下您不需要使用扩展运算符吗？ const list_bank = useSelector((state) => ...state, receive_checks.list_banks.data);
现在我发现了。当我刷新页面时，选择器被删除。这就是为什么数组是 0
初始解决方案我将转到另一个页面，然后我将返回该页面列表返回。但是这里的新问题是即使我刷新页面也如何永久设置它

标签： reactjs redux

【解决方案1】：

下一个问题：刷新页面后useselector没有更新

如果您希望您的状态在刷新后仍然存在，请使用 redux-persist 之类的。它将在本地存储中保存状态。

就您最初的问题而言，您需要发布更多代码。

【讨论】：