Javascript 删除详细信息类型错误：无法读取属性'；数据'；未定义的

我想从我的表中删除一个细节。我不是在给api打电话。都是从redux商店买的

这是我的reducer.js：

          case billsTypes.DELETE_DETAIL:{

           const id = action.payload.data._id
              return{
                   ...state,
                   details: state.bill.detail.filter(item => item._id !== id)
                     }
                 }

这是我的action.js

            export const deleteDetail = id => dispatch =>{

              dispatch({type: billsTypes.DELETE_DETAIL, payload: id});
              };

这是我执行动作时的渲染：

             render(){

              const{detailItem,index,fields,isSubtotal} = this.props;

              return(


                 <tr key={index}>

                   <td>
                     <Field 
                      id={`${detailItem}._id`}
                      name={`${detailItem}.quantity`}
                      type='number'
                      component= {UtilityQuantity}
                      placeholder= '...quantity'
                      // label = "Quantity" 
                        />
                         </td>


                          <td>
                          <Field 
                           id={`${detailItem}._id`}
                           name={`${detailItem}.product.code`}
                           type="number"
                           component= {UtilityCode}
                           placeholder='...Product's code'
                           //label = "Product's code" 
                             />
                            </td>
                             <td>
                               <Field 
                                id={`${detailItem}._id`}
                                name={`${detailItem}.product.name`}
                                type="text"
                                component= {UtilityName}
                                placeholder='...Product's name'
                                // label = "Product's name" 
                                    />
                               </td>

                                  <td>
                                  <Field 
                                   id={`${detailItem}._id`}
                                   name={`${detailItem}.product.price`}
                                   type="number"
                                   component= {UtilityPrice}
                                   placeholder= '...Price'
                                   // label = "Product's price" 
                                     />
                                   </td>

                                    <td>
                                     <Field 
                                      id={`${detailItem}._id`}
                                      name={`${detailItem}.subtotal`}
                                      component= {UtilitySubtotal}
                                      placeholder= '...subtotal'
                                      // label = "Subtotal" 
                                          >
                                       {isSubtotal}
                                      </Field> 
                                      </td>

                                      <td>
                             {/* <button className='btn btn-light mr-2'
                                 type="button"
                                 title="Remove Detail"
                                 onClick={() => fields.remove(index)}>

                                  Delete
                              </button> */}

                                        <a
                                         className='mr-2'
                                         href='#more'
                                        onClick={() => {
                                                 if (
                                                   window.confirm(
                                                    'Are you sure to want to delete the item?'
                                                        )
                                                         )
                                                    this.props.deleteDetail(detailItem._id);
                                                           }}
                                                       >
                                                     DELETE ITEM
                                                        </a>

                                                     </td>

                                                        </tr>
                                                       );

                                                        }

                                                       }

我没有调用api rest，因为我在redux商店工作

---

如何修复此错误？我需要解决此问题，但我不知道我能做什么。

在我看来，您的

有效载荷

是您的id，而不是包含

\u id

键的对象，如

action.payload.data.\u id

所示。相反，

id

只是

action.payload

。它应该是什么？好吧，我假设

const id=action.payload

我刚刚尝试过，但现在我无法从账单表单的表中删除该行。

                             case billsTypes.DELETE_DETAIL:{

                                const id = action.payload.data._id
                                      return{
                                         ...state,
                                   details: state.bill.detail.filter(item => item._id !== id)
                                             }
                                               }