React table v7固定列与react-window

2024-04-11

我有一张带有react-table v7 的表。使用react-window进行虚拟化。现在表的最后一列已修复,但我无法修复表的最后一列。 React-window 的内部元素有overflow: auto这不会让色谱柱最终变得粘稠。

这是link https://codesandbox.io/s/lucid-tharp-s1ksy?file=/src/App.js重现该问题。

我正在努力实现一些目标these https://codesandbox.io/s/sweet-cori-gl81g lines.

如果您看到问题链接,我希望将最后一行固定在某个位置,并使其余行保持水平滚动。


对于粘性标头,您应该实施内部元素类型道具如反应窗口所说this https://codesandbox.io/s/0mk3qwpl4l.

但对于粘性列,也许更标准的方法是使用旁边的另一个网格或列表并同步它们的滚动位置,例如this https://codesandbox.io/s/2jvl09przn one.

你也可以使用反应基表 https://github.com/Autodesk/react-base-table它实现了整个侧面粘性行和列。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

React table v7固定列与react-window 的相关文章

  • React 不响应按键事件

    我正在尝试实现一些非常基本的按键检测 但我根本无法让它工作 我有一个裸露的组件 应该在onKeyDown事件 但控制台中没有任何内容被注销 class App extends React Component constructor prop
  • 如何仅使用CSS设置某个角的边框半径

    如上所示 我可以只给顶部部分而不给底部提供半径 或者有时给底部而不是顶部提供半径吗 有没有办法只给一个角提供边界半径 Like border radius top left top right bottom right bottom lef
  • CSS - SASS:使用基于@each的mixins来生成多个背景

    我正在使用 CSS 创建发型和颜色目录 我有 55 种不同颜色和发型的组合 每种发型和颜色都有自己的图像 SVG 文件 我需要将它们全部组合成一个背景 使用 CSS3 的多背景功能 我编写了这个混合来生成多个背景 它基于 mixin在这篇文
  • 监听浏览器宽度以进行响应式网页设计?

    我正在努力使我的网站适合移动设备 我想知道浏览器窗口的大小 以便当它比 728px 窄时我可以执行某些操作 而当它大于 728px 时我可以执行其他操作 这必须考虑到调整 PC 上的窗口大小以及在手机中从纵向模式更改为横向模式 如何才能做到
  • 使用本机 JavaScript 获取过渡中的 CSS 值

    这个问题之前被问过 但答案使用了 jQuery here https stackoverflow com q 8920934 3186555 因此 我将调整问题以专门询问native解决方案 to 最小化依赖关系 假设您有一个 div 然后
  • React + Semantic-UI:在 UI MODAL 中使用表单

    在没有 React 的普通旧 Semantic UI 中 我已经能够毫无问题地将表单放入 Modal 中 使用 Semantic UI React 版本 我能够在模态中显示表单 但它并没有按照我期望的方式工作 例如 模态框显示后 模态框内的
  • 将 Div 放置在另一个 DIV 下方

    我有两个 DIV 元素 其中之一具有绝对位置 主 DIV 的左下角 第二个 DIV 是隐藏的 只有单击链接才能显示 我需要第二个出现在第一个下方 但由于第一个 div 的位置是绝对的 第二个 div 出现在第一个 div 之上 HTML 代
  • 渲染作为 Prop 传入的 Component

    我怎样才能渲染一个StyledComponent它是作为道具传入的吗 我正在传递一个Spinner组件到我的BarComponent作为渲染的道具 我尝试使用 this props icon in my BarComponent在下面的示例
  • 每 2 行后使 html 表格的边框变厚

    我创建了一个包含一些内容的表 其中有 12 行和 2 列 我想显示边框 但每 4 行之后 我想将水平边框设置为比正常情况更粗 怎么做 请在这里帮忙 试试这个选择器 table tr nth of type 4n td border bott
  • 刷新或直接点击链接时找不到 React.js 页面

    我在此链接上有一个反应项目 https notchy cross 000webhostapp com https notchy cross 000webhostapp com 如果向下滚动 您会看到一个名为 产品类别 的部分 https i
  • 纱线安装错误:无法下载Chromium

    Yarn 安装无法下载 Chromium 错误如下 D workspace www ant design mobile pro yarn yarn install v1 12 3 Directory D workspace www ant
  • 将鼠标悬停在原点时会触发translateY()

    当您将光标移动到按钮底部时 是否可以无限期地不触发动画 它看起来是这样的 gif https i stack imgur com QwdHW gif and codepen https codepen io jaeyson pen GwwJ
  • Sass:@use 出错,未定义变量

    我正在使用 Sass 并且想要使用 use关键字而不是 import 因为 import有很多问题 另外只有dart sass支持这个功能 我将node sass改为dart sass 然而 问题出现了 我原来的代码 import carb
  • ReactTransitionGroup 不适用于 React-redux 连接组件

    我正在开发一个更大的项目 但我创建了这个简短的示例来说明问题 如果我使用Box组件 它的工作原理 它在控制台中输出componentWillEnter and componentWillLeave当我们点击按钮时 如果我使用BoxConta
  • 如何使使用 css 调整大小的图像在 IE 中看起来不错?

    当使用 css 宽度 高度或属性宽度 高度缩放图像时 IE6 和 IE7 无法很好地缩放网页中的图像 我不确定它默认使用哪种算法 但这不好 在这些浏览器中缩放时 缩放图像会显示锯齿伪影 幸运的是 有一种方法可以通过简单的 css 规则强制
  • React Router v4 不渲染组件

    React Router v4 渲染组件存在问题 在应用程序初始加载时 它将呈现与 URL 相对应的正确组件 但是 任何后续的组件Link单击不会呈现所需的组件 图书馆 反应路由器 4 2 2 https reacttraining com
  • CSS 到底如何计算相对尺寸

    我想更好地理解某些 CSS 行为 这与具体问题无关 我只是在调试网站时遇到的 让我们在固定位置的 div 中放置一个全宽图像 div img style width 100 src https via placeholder com 150
  • 创建反应应用程序:npm 错误!解析“...”附近时 JSON 输入意外结束

    描述错误 npx create react app my app不适合我 我试过npm cache clean force但我一次又一次地遇到同样的错误 重现步骤 npm cache clean force npm npx create r
  • 使用javascript动态更新css内容

    需要将 css 更新为动态值 我不确定最好的方法是什么 div style zoom 1 div 缩放级别将根据窗口大小调整触发 应用程序将相应缩放 我将此应用程序加载到 cordova 中并让它在 iPAD 中运行 然后我意识到需要使用
  • 使用 Enzyme 测试 `React.createRef` api

    我想测试下面的类 它使用React createRef api 不过 快速搜索并没有发现任何这样做的例子 有人成功过吗 我该如何嘲笑裁判 理想情况下我想使用shallow class Main extends React Component

随机推荐

  • MySQL 和 MariaDB 中 JSON_SEARCH 的区别

    我只是尝试使用获取价值路径JSON SEARCH功能 SELECT JSON SEARCH 12 13 12 123 one 123 null path 当我在 MariaDB 中运行此查询时我得到了想要的结果 path 2 12 但在顶级
  • 使用 SPIFFS 加载文件时出现问题 (ERR_CONTENT_LENGTH_MISMATCH)

    好吧 这两天我一直在研究这个问题 但我仍然觉得我一无所获 我最近开始使用SPIFFS 文件系统 for Arduino开发于呼扎 ESP8266像FSBrowser ino例如 虽然它在分离代码方面非常出色 但随着我的代码不断增长 它在稳定
  • Delphi 2009 功能区控件 - 玻璃框架

    我已经开始使用 Delphi 2009 中新的内置功能区控件并使用自定义框架 以便应用程序按钮和迷你工具栏向上滑动到窗口框架上 但我想知道在 Vista 上是否应该使用玻璃效果 例如Office 2007 可以 如果可以 我将如何启用此设置
  • JSF 加密劫持恶意软件

    现在我知道这不是一个安全或恶意软件删除网站 不过我觉得这是一个 JSF 特定问题 我注意到我的网站不断受到向网页注入 JavaScript 文件的攻击 该恶意软件正在从某个具有以下模式的随机 URL 加载脚本文件 https johndi3
  • 针对性能或代码大小的 C 编码实践 - 超出编译器的范围

    我想看看程序员可以用 C 做什么 这可以确定生成的目标文件的性能和 或大小 For e g 1 将简单的 get set 函数声明为内联函数可以提高性能 但代价是占用空间更大 2 对于不使用循环变量本身值的循环 向下计数到零 而不是向上计数
  • 比较 python 中的两个列表并返回匹配值的索引

    对于两个列表 a 和 b 如何获取两者中出现的值的索引 例如 a 1 2 3 4 5 b 9 7 6 5 1 0 return indices of a a b 会回来 0 4 with a 0 a 4 1 5 做到这一点的最好方法是b a
  • 如何将复杂的 django 查询构建为字符串

    我正在动态生成具有多个参数的查询字符串 我试图在字符串中包含对象名称 坚果 果酱 该查询必须是 OR 查询 我的代码如下 我收到如下所示的错误 解决方案here https stackoverflow com questions 18161
  • 覆盖 Hibernate 注解

    我正在开发一个使用 Hibernate 并连接到 Oracle 实例的 Java 应用程序 另一个客户希望使用相同的应用程序 但要求它在 MS SQL Server 上运行 我想避免对现有注释进行更改 而是创建一个 xml 文件包 我们可以
  • 如何从 SharePoint 自定义列表中的日期/时间列获取日期和当前时间

    我在 sharepoint 2007 的自定义列表之一中有一个名为 提交日期 的列作为日期 时间 它总是设置为今天的日期和上午 12 点时间 而不是我想显示今天的日期和当前时间 hh mm ss 我尝试创建计算列 TestDate 公式为
  • 如何从给定缓冲区解码视频? (媒体编解码器)

    我需要解码来自交错流 如 AVI 的数据 所以 这意味着我有一个以这种形状 序列 构建的容器 mp4 gt other data gt mp4 gt other data gt so on 目前我有一个基本的实现MediaCodec解码器
  • 为什么直接导航到该路线时不匹配?

    郑重声明 这是使用当前相当新的 angular router 3 0 0 alpha 8 路线定义位于帖子底部 当尝试在我的应用程序中导航时 行为会有所不同 具体取决于我是直接输入 URL 还是通过链接输入 Works 进入http loc
  • 一个人可以采用敏捷技术吗? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 目前正在找工作 我看到很多地方都要求敏捷经验 但在我找到使用敏捷的团队的工作之前 我怀疑我永远不会获得这种经验 是否可以仅由一个人采用敏捷方法
  • AttributeError:模块“numpy”没有属性“core”

    我想知道是否有人在运行 Spark 并尝试导入 numpy 时遇到这个问题 Numpy 在标准笔记本中正确导入 但是当我尝试通过运行 Spark 的笔记本导入它时 出现此错误 我有最新版本的 numpy 并且正在运行最新的 anaconda
  • RxJava 中的笛卡尔积

    是否有可能在rxjava中获得两个Observables的笛卡尔积 像这样的事情 A gt 1 2 3 B gt a b A x B gt 1 a 1 b 2 a 2 b 3 a 3 b 你想要的是 对于一个数字 产生与你有字母一样的一对
  • 提交 OSX 应用程序及其捆绑包中的帮助程序应用程序

    我真的要被这个问题搞疯了 我有一个应用程序 其中包含一个简单的帮助程序应用程序 用于管理主应用程序的登录项 当我尝试提交应用程序时 我收到与配置文件和权利相关的错误 我确信问题与助手应用程序有关 因为在我添加它之前 提交工作没有问题 目前
  • PHP获取下拉列表选择选项值

    在我的下拉列表中 每个选项都有两个不同的值 我怎样才能检索两者 让我来说明一下我的意思
  • 从 Html 源在 Excel 中创建注释

    因此 可以从 Html 创建 Excel 文件 我发现很多事情都是可能的 比如添加图像 格式化等 只需一些 css 调整 然而 我现在想做的是让小红色三角形评论显示出来 我创建了一个空白的 Excel 文件 除了注释之外什么都没有 但它生成
  • 在 python 中向量化 for 循环

    我是 python 的新手 有一个关于向量化代码的问题要问 def makeNames2 nList for nLi in nList nLIdx i for i j in enumerate nList if j nLi if nLIdx
  • 如何将 MapView 从像素缩放到米

    我正在制作一个使用 Google Maps API 的 Android 应用程序 我想将 MapView 缩放到 X pixels X meters 例如 我的屏幕中 MapView 的 5 像素 实际距离为 20 米 那可能吗 Thx 使
  • React table v7固定列与react-window

    我有一张带有react table v7 的表 使用react window进行虚拟化 现在表的最后一列已修复 但我无法修复表的最后一列 React window 的内部元素有overflow auto这不会让色谱柱最终变得粘稠 这是lin