如何调度接收到的值？

Question

我有：

const initialState = {
    take:10,
    page: 1,
    startDate: new Date(new Date().setDate(new Date().getDate() - 3100)),
    endDate: new Date(),
    IdentityTitle: "",
    OrderStatusId: null,
  };
const reducer = (filter, action) => {
    return {
      take: action.take,
      page: action.page,
      startDate: action.startDate,
      endDate: action.endDate,
      IdentityTitle: action.IdentityTitle
    OrderStatusId: action.OrderStatusId,
     
    };
  };
  const [filter, dispatch] = useReducer(reducer, initialState);

当我在console 中提交表单时：

  <TableFilter
          fields={tableFilterFields}
          onSubmit={(filters) =>
            console.log(filters)}

             /////result console:

0: {property: "StartDate", value: Tue Jun 22 2021 16:22:00 GMT+0430 (Iran Daylight Time)}
1: {property: "EndDate", value: Wed Jun 23 2021 16:22:00 GMT+0430 (Iran Daylight Time)}
2: {property: "OrderStatusId", value: 4}
3: {property: "IdentityTitle", value: "test"}

/>

如何在onSubmit方法中派送？

Answer 1

你的减速器应该是这样的

const reducer = (state, action) => {
   switch(action.type){
    case "PAGE_CHANGE":
    case "NEW_ORDER":
    return {
      ...state
      take: action.payload.take,
      page: action.payload.page,
      startDate: action.payload.startDate,
      endDate: action.payload.endDate,
      IdentityTitle: action.payload.IdentityTitle
    OrderStatusId: action.payload.OrderStatusId,
     
    };
    default:
        return state;
   }
  };

在你的onSubmit函数中

let payload = Object.fromEntries(filters.map(f => [f.property,p.value]));
dispatch({ type:"NEW_ORDER", payload:dispatchObj });

页面更改

 const pageChangeHandler = (page) => { 
   dispatch({ type:"PAGE_CHANGE", payload:{ page }}); 
 }

onPageChange={pageChangeHandler}