gpt4 book ai didi

javascript - 从嵌套数组中 react DataTable 值

转载 作者:行者123 更新时间:2023-12-03 14:26:57 26 4
gpt4 key购买 nike

请看我的代码:

import React, { Component } from 'react';
import { BootstrapTable, TableHeaderColumn } from 'react-bootstrap-table';

class App extends Component {
constructor() {
super();
this.state = {
student: [
{
"studentName":"Jack",
"stdCtExamMarks":[
{
"subjectName":"English "
}
]
},
{
"studentName":"John",
"stdCtExamMarks":[
{
"subjectName":"Bangla "
}
]
}
]
};
}
render() {

return (
<div className="App">
<BootstrapTable data={this.state.student} >
<TableHeaderColumn dataField="studentName" isKey={true} dataAlign="center" dataSort={true}>Name</TableHeaderColumn>
<TableHeaderColumn dataField="stdCtExamMarks.subjectName" dataSort={true}>Subject</TableHeaderColumn>

</BootstrapTable>
</div>
);
}
}

export default App;

在表中,我可以获得 StudentName 的值,但我也需要 subjectName 值。我怎样才能做到这一点?

当我将“studentName”放入数据字段时,它就可以正常工作,但“stdCtExamMarks”的嵌套数组不会在字段中抛出任何值

最佳答案

我以前没有使用过此控件,但根据文档,您也许可以使用 TableHeaderColumndataFormat 属性。像这样的事情:

subjectFormatter(cell, row) {
return cell[0].subjectName
}

render(){
return (
...
<TableHeaderColumn dataField="stdCtExamMarks" dataFormat={this.subjectFormatter} dataSort={true}>Subject</TableHeaderColumn>
...
)
}

请注意,stdCtExamMarks 是一个数组,正如您在上面所描述的那样,因此我使用了索引0,但您可能想要得到不同的东西。

关于javascript - 从嵌套数组中 react DataTable 值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50312779/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com