反应计算表上排序的搜索页面页脚变化总和，我们如何能做到这一点

Question

反应计算表上排序的搜索页面页脚变化总之，我们如何才能做到这一点。

import React from "react";
import { render } from "react-dom";
import ReactTable from "react-table";
import "react-table/react-table.css";

const data = [
  {
    id: 1,
    product: "apple",
    stock: 1,
    price: 123
  },
  {
    id: 2,
    product: "pie",
    stock: 2,
    price: 22
  }
];

const App = () => (
  <div>
    <ReactTable 
      data={data}
      columns={[
        {
          Header: "Id",
          accessor: "id"
        },
        {
          Header: "Product",
          accessor: "product",
          Footer: "Summary"
        },
        {
          Header: "Stock",
          accessor: "stock"
        },
        {
          Header: "Price",
          accessor: "price",
          Footer: (
            <span>{
              data.reduce((total, { price }) => total += price, 0)
            }</span>
          )
        }
      ]}
      defaultPageSize={2}
    />
  </div>
);

上面的代码可以用来获取所有行的列数据的总和，任何人都可以请引导我正确的方式。

Answer 1

导入此第一进口_从“lodash”;

然后下面的代码应该解决您的问题：{头： “价格”，访问： “价格”，ID： “价格” 页脚：{的.sum（.MAP（数据，d => d.price））}）}

请注意，应和的.sum之间下划线符号{。同样强调之间符号（和.MAP不知怎的，它被删除时，我在这里发布我的代码。