Question

任何人都知道如何做到这一点，以便react-bootstrap-table-next具有删除和添加行功能？我在他们的文档中找不到任何内容：https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/about.html

最终希望使用axios将数据从NoSQL数据库导入到表中，然后让某人编辑表中的数据并将其推送到数据库中。

这是我对StackOverflow的第一个问题，感谢所有提示。

这是我到目前为止所得到的。它成功呈现了一个简单的表格。

 import BootstrapTable from "react-bootstrap-table-next";

import React, { Component } from "react";

const products = [
  {
    id: "1",
    name: "Banana",
    price: "1"
  },
  {
    id: "2",
    name: "Carrot",
    price: "5"
  },
  {
    id: "3",
    name: "Apple",
    price: "4"
  }
];

const columns = [
  {
    dataField: "id",
    text: "Product ID"
  },
  {
    dataField: "name",
    text: "Product Name"
  },
  {
    dataField: "price",
    text: "Product Price"
  }
];

class Table extends Component {
  render() {
    return (
      <div>
        <BootstrapTable
          keyField="id"
          striped
          hover
          data={products}
          columns={columns}
        />
      </div>
    );
  }
}

export default Table;

希望这很容易做到，只是在文档中找不到。

Answer 1

您不需要向表本身添加功能。 BootstrapTable组件已与其数据源分离。这意味着您需要编写一个处理数据的组件，并将其作为道具传递给BootstrapTable组件。然后，您可以将Table组件包装到该组件中。

react-bootstrap-table-next-如何为表添加删除功能？

1 个答案: