如何设置React-Table的样式？

Question

我正在使用react-table创建一个可过滤的表，但是我想以我想要的方式设置它的样式。我应该直接在node_modules应用程序中更改它，还是应该创建自己的CSS文件并覆盖对元素的动态检查？

Answer 1

对于React-Table v6，如果你想使用css文件，你基本上可以通过两种方式来实现。

1. 从npm包中的css文件开始，覆盖您想要更改的部分
2. 从您自己的css文件开始，设置所有需要设置样式的样式

广告1：

import "react-table/react-table.css"
import "./your_own_styles.(s)css"

广告2：

import "./your_own_styles.(s)css"

要了解可以在自己的css文件中使用什么，可以查看以下要点：https://gist.github.com/sghall/380aa1055bcad4db22d1fc258d7f09d0

或者从react-table npm包(在您的node_modules中)复制react-table/react-table.css。

Answer 2

绝对不要更改node_modules。您可以设置内联样式，也可以附加样式。

https://reactjs.org/docs/faq-styling.html

Answer 3

一定要用你自己的文件覆盖CSS类。这是从库中设置组件样式的常见做法。