ReactTable 垂直排列元素

Question

我正在尝试在我的应用程序中使用 'react-table' 库。我不确定我做错了什么，但 table 中的所有元素都垂直显示在左侧，而不是在网格中。这发生在我的应用程序中，所以我尝试创建一个新应用程序来显示这个 table.

我逐字复制了这个例子：here唯一的区别是我硬编码了两条记录的数据。

页面显示如下：

Name
Info
Stats
First Name
Last Name
Age
Status
Visits
Bret
Till
33
spoken for
4

是否有一些 CSS 问题正在取消内联之类的？我刚开始对 CSS 做出反应，甚至更糟。我确实记得添加这个导入：

import "react-table/react-table.css";

这是一个说明问题的最小回购协议：

react-table-minimal-repo

Answer 1

编辑-1

你的项目的问题是设置 modules: true，如果你评论说项目有效

require.resolve('style-loader'),
{
  loader: require.resolve('css-loader'),
  options: {
    importLoaders: 1,
    // modules: true,
    localIdentName: '[name]__[local]__[hash:base64:5]'
  },
},

详情见下期

https://github.com/ant-design/babel-plugin-import/issues/166

原答案

这个问题是因为你在弹出项目后弄得一团糟。我创建了一个新项目

react-create-app reacttable2

并且复制了你的 src 文件夹，一切正常

ReactTable 垂直排列元素

ReactTable is ordering elements vertically

javascript

css

reactjs

react-table