I don't have border on react-bootstrap-table-next

Question

I use react-bootstrap-table-next in this way:

import React, { Component } from 'react';
import products from './data.js';
import 'react-bootstrap-table-next/dist/react-bootstrap-table2.min.css';
import BootstrapTable from 'react-bootstrap-table-next';

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

class App extends Component {
  render() {
    return (
      <BootstrapTable keyField='id' data={ products } columns={ columns } />
    );
  }
}

export default App;

But, there is no border.

What I'm missing?

Answer 1

I'm the creator of react-bootstrap-table, please check https://react-bootstrap-table.github.io/react-bootstrap-table2/docs/getting-started.html.

obviously, you are missing to add bootstrap css or there're some problem when you add bootstrap css.

Allen