问题标签 [material-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 回答
162 浏览

material-table - Is there a way to change the color of the loading icon from remote data for tables built with material-table?

I'm using this library material-table for my data table. I get the primary color of my theme for the circular-progress loading icon. I'd like to change it to the secondary color but I don't see any props for changing the styling for it.

0 投票
1 回答
4535 浏览

material-table - 如何使用材质表实现对远程数据的乐观渲染?

我正在为我的应用程序中的数据表使用库材料表。我将数据道具设置为使用来自 this.state.data 的数据,并且添加行将使用 setState 在我的表上更新。但是在切换到远程数据后,表格在添加一行后不会更新。有没有另一种方法可以通过远程数据实现这一目标?

0 投票
2 回答
524 浏览

reactjs - 当鼠标在材料表中的一行上时突出显示一行

当鼠标悬停在一行上时,我必须使用哪个组件来获得连续突出显示,使用材料表组件?

我力求找到任何属性或哪个组件覆盖来获得它。

提前感谢您的宝贵时间

这是代码https://codesandbox.io/s/yv13zjr9w9

0 投票
1 回答
2910 浏览

reactjs - How can you customize a field when adding a row from the library material-table?

When adding a row to an editable table using the library material-table, how can you customize a field? I'd like to either make the field read-only or something else where the user cannot change the field. I've tried the read-only option for columns, but that only makes it read-only for updating fields.

0 投票
1 回答
980 浏览

reactjs - 有没有办法从材质表中的自定义操作手动触发 isLoading 动画?

我正在使用材料表库。我想使用库用于自定义异步操作的当前加载动画。单击自定义操作后,它会在 aync 解决后打开然后关闭。

0 投票
1 回答
2894 浏览

material-ui - 如何从材质表中的自定义操作按钮中删除背景波纹效果?

我想从我在工具栏中创建的自定义按钮中删除背景波纹效果,以代替默认图标按钮。请参阅下面的屏幕截图,我只想从导入和添加按钮中删除波纹效果(圆圈一),所有其他操作图标按钮应正常运行。

表格截图

0 投票
1 回答
1187 浏览

reactjs - 有没有办法用从后端收到的数据更新表

我正在使用material-ui向用户列出一组违规行为以选择一个或多个违规行为,然后在选择期间我从每个违规行为中提取它idupdate the state因此i'll have an array of ids to send it to backend

这是我的代码

我希望receive array of Ids然后mark each row that it's id is in the array Of Ids让用户知道他之前选择了什么。

提前谢谢。

0 投票
0 回答
1375 浏览

angular - 每列具有过滤功能的物料表

我正在用材料实现一个通用表。

问题是,我怎样才能创建一个过滤器方法,它只过滤他自己的列。

代码看起来像这样:

和 ts。文件如下所示:

我已经找到了定义列的过滤器的解决方案,但表无法运行方法 createFilter()。

我已经调试过了。问题是函数 createFilter 只会运行一次,如果我在过滤器中提示某些内容,函数 createFilter() 将不会运行。

如果我在搜索输入字段中提示某些内容并在函数 filterFunction 中设置断点,则不会发生任何事情。

在网上我找到了这个例子:

https://stackblitz.com/edit/angular-hbakxo-xctfqy?file=app%2Ftable-filtering-example.ts

在此示例中,它也使用了相同的方法。

有人可以告诉我,我做错了什么。

此致,

狮子座

0 投票
1 回答
16751 浏览

pagination - 在材料表和 reactjs 中自定义分页的任何示例

自定义分页的任何示例?材料表和reactjs. 我想将页面大小传递给服务器,并且需要从分页中隐藏第一个和最后一个按钮

0 投票
1 回答
1976 浏览

material-table - How can I use tableRef.onRowSelected to update the UI via the onRowClick property?

I've written an onRowClick function to change the rows tableData.checked value when the row is click as seen in the answer here #300

I can see the checked state updating in a console log but the checkbox itself does not change visibly until I actually click another rows checkbox. It will then show all the checkboxes that had their tableData.checked values updated. I'd like to be able to have the checkbox actually display this change to the user onRowClick.

Here is my current code:

This is the state of the UI on my first row click:

Screen Shot 2019-04-04 at 2 32 27 PM

Console Log on first row click:

Screen Shot 2019-04-04 at 2 32 46 PM

UI After selecting one checkbox (clicking directly on the checkbox of another row):

Screen Shot 2019-04-04 at 2 34 32 PM

Console Log after clicking the initial row again:

Screen Shot 2019-04-04 at 2 35 23 PM

Is there any way to make sure the UI updates for the MaterialTable component without resetting anything when the checked state is updated programmatically?

I've also gotten tableRef.onRowSelected working properly but the UI still doesn't re-render with the rows checkbox selected.

Here is the codesandbox with the fix I've attempted