我在redux商店中创建了一个名为“VendorItemSelect”的状态。它是用空数组初始化的。我有一个名为vendorTable的组件,我使用connect函数连接到商店。
在勾选复选框时,我将删除一个要存储的操作以更新我的状态。这会将一个新对象(行)推入我的数组中,并使用新的状态更新redux状态。
在选中另一个复选框时,它应该从存储中返回状态,其中包含通过dispacthing操作添加的新对象,并且它应该推送一个新对象。现在,它应该包含两个对象的数组。
但是redux state总是返回空数组,并且state总是用新行更新。我在这里粘贴一些代码和截图:
我要调度操作的代码:
let items = updateItems(selectedItem, row.original);
dispatch(setVendorListItem(items)); /
从redux store获取 prop :
export const VendorsItemTable = ({ onSubmit , defaultRfqSelected, selectedItem, ReceivedRFQs }) => {
MapStateToProps:
const mapStateToProps = (state) => {
return {
defaultRfqSelected: state.rfq.selectedRow,
ReceivedRFQs: state.rfq.RFQList,
selectedItem: state.rfq.vendorItemSelect,
};
};
我的减速器:
const initialState = {
selectedRow: 0,
RFQList: [],
selectRFQROW: {},
quoteSent: '',
vendorItemSelect: [],
vendorSelect:[],
};
export const RFQReducer = (state = initialState, action) => {
switch(action.type) {
case 'RowSelection' : return {
...state,
selectedRow: action.payload,
};
case 'RFQList' : return {
...state,
RFQList: action.payload,
}
case 'RFQQuote' : return {
...state,
quoteSent: action.payload,
}
case 'RFQVendor': return {
...state,
vendorSelect: action.payload,
}
case 'RFQVendorItem': return{
...state,
vendorItemSelect : action.payload,
}
default:
return state
}
}
RFQActions:
导出函数UpdateRowSelection(data){ return { type:“RowSelection”,有效负载:数据} }
导出函数SetRFQRowList(data){ return { type:“RFQList”,有效负载:数据} }
函数setVendorListItem(data){ return{ type:“RFQVendorItem”,有效负载:数据} }
函数setVendorName(data){ return{ type:'RFQVendor',payload:数据} }
[
1条答案
按热度按时间b1payxdu1#
操作
setVendorListItem
也应该更新vendorItemSelect
数组,但它只更新selectedItem
变量。要纠正这一点,请将reducer中
RFQVendorItem
的大小写改为:这样,一个新的行将被添加到
vendorItemSelect
数组中。此外,您必须确认选中复选框的组件是从中分派
setVendorListItem
操作的组件。那么:
1.修改reducer的
RFQVendorItem
大小写以匹配上面的代码。1.查看选中复选框的组件是否是分派
setVendorListItem
操作的组件。