问题标签 [react-bootstrap-table]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
338 浏览

reactjs - 如何生成未知大小的标头

给定

我不能打电话generateHeader(),因为在这种情况下,react 要求我将所有东西都包装在一个父级<span>中。当我将 TableHeaderColumn 放在 span 内时,BootstrapTable 会中断。

如何生成动态标题?

0 投票
1 回答
6306 浏览

jquery - 通过 react-bootstrap-table 中的按钮获取行数据

我正在使用 react-bootstrap-table (var ReactBsTable = require("react-bootstrap-table"))。
我尝试添加一个按钮,单击该按钮会显示与此按钮行对应的 ID 或行数据。我使用了 jquery,但我为按钮提供了一个 id,但所有这些按钮都有相同的 id(validatebutton),所以只有第一个可以工作,其余的没有,因为我不能为许多组件使用相同的 id。

请有任何想法。

0 投票
1 回答
485 浏览

javascript - 如何使用 React 设置状态并避免递归?

我将 React 与 Flask 服务器一起使用,并且有一个用户可以输入信息的表格。tableData当用户编辑单元格、添加新行、删除行等时,此子表会更新 MainApp 的状态。

我的问题是我image在 MainApp 中使用状态来存储图像 URL(此 URL 也包含哈希,因此每次客户端请求信息时它都会更改)。但是,我还使用tableDataMainApp 中的状态来存储用户更新表时更改的表信息。该调用componentWillUpdate依次获取图像 blob,将其转换为 URL 并更新状态image。这反过来会调用componentWillUpdate您可能想象的导致递归调用。React 文档说不要调用setStateinside 。componentWillUpdate我很好奇推荐的方法是什么。

我的预期行为是用户编辑表格上的单元格,MainApp 向服务器发送带有表格信息的请求,MainApp 接收图像并相应地更新页面。我不应该使用image状态来存储 URL 吗?

一种方法是使用setStatecomponentWillUpdate使用shouldComponentUpdate基于 globalVariable 的逻辑(shouldComponentUpdate将被多次调用),但我很确定这可能不是推荐的方法。

0 投票
3 回答
7736 浏览

javascript - 无法访问 react-bootstrap-table 中的嵌套字段

Mongo 数据库可以返回一个包含嵌套数据的数组。我想显示包含在以下内容中的数据:{applications: {data: {description: 'My description}}}

但它根本不起作用。你有什么想法吗,我在文档和 SO 中都没有找到任何东西。

谢谢你的帮助 ;)

0 投票
3 回答
5101 浏览

javascript - 使用工具提示反应引导表

我正在使用反应引导表来显示存储在info数组中的一些数据。

有些行可能有一个额外的属性oldPrice,我想将其显示为显示价格的工具提示。我怎样才能做到这一点?

0 投票
2 回答
10085 浏览

reactjs - 如何编辑反应引导表并在编辑后保存数据

如何在浏览器页面直接编辑表格并在重新加载页面后保存数据。该表是使用 react bootstrap table 制作的。项目的屏幕截图在这里。像截图一样编辑和保存

我的项目代码在这里。

反应引导在这里

0 投票
0 回答
804 浏览

reactjs - React-bootstrap-table:警告:不应改变组件的子级

我在我的代码中使用了这个简短的示例片段

一切都很完美。有表,有数据。但是(!)我在 Chrome 控制台中看到下一条警告消息:

在此处输入图像描述

而如果我使用自己的元素,则没有警告..
怎么了?如何解决?

0 投票
3 回答
1131 浏览

reactjs - 如何让我的 React 应用程序使用 crud 渲染 Bootstrap 表

我正在使用以下代码生成一个简单的 UI,并尝试将其转换为使用 Bootstrap。

这是我的原始代码(使用Skeleton);

我试着做这样的事情;

但它不像我预期的那样工作。我正在使用react-express-examplar作为我的起点。

如何让 Bootstrap 表在我的 React 应用程序中工作?

0 投票
1 回答
2831 浏览

reactjs - 反应引导表按钮与行点击冲突

我开始使用 React 以及引导程序拥有的所有移植库和自定义库。

目前我遇到了反应引导表的问题:我已经定义当用户点击一行时,它会显示一个面板来编辑该行,但我在其中一个行列中也有一个按钮,所以当我点击按钮,单击该按钮,但随后触发了 onRowClick 事件,我不希望这种情况发生,我尝试了很多不同的方法,但我无法使其工作,你知道怎么做吗?

这是表格:

这就是我在单元格中呈现按钮的方式(this.echo 只是一个调试警报):

问题是当我悬停按钮时,该行保持悬停状态。

0 投票
1 回答
420 浏览

javascript - How do I turn part of Redux store into an array

Okay, here's the pickle that I'm in, one of my actions in actions/index.js is:

and when I console.log(persistedState) from above in the Chrome console I get my people state exactly like this.

Then when I drill down into people: Object above, I get them like this:

and when I drill down into each one of these puppies (by clicking on the little triangle in Chrome console) I get each like this:

Now, here's where I'm stuck.

The table I'm using is Allen Fang's react-bootstrap-table which only accepts array's, and it get's called like this <BootstrapTable data={people} /> so my above data needs to be converted to an array like this:

My question specifically is how do I convert my people state shown above into this necessary array? In my action/index.js file I've tried: Object.keys(everything!!!)

And lastly, once I have the array, what's the best way to pass that array into <BootstrapTable data={here} /> using state, a variable, a dispatched action, something I've never heard of yet?

Any help will be very much appreciated!! FYI, this is my first question in Stack Overflow, feels nostalgic. I'm a full-time police officer, and trying learn to code on the side. Thanks again!

UPDATE:

Thanks to a suggestion by Piotr Berebecki, I'm tying it this way:

and getting [null,null,null]

like this:

enter image description here