gpt4 book ai didi

javascript - React.js 和 Firebase 如何在我的 bootstraptable 中显示数据

转载 作者:行者123 更新时间:2023-12-03 02:02:36 24 4
gpt4 key购买 nike

大家好,我想创建一个简单的表,以便与从 firebase 获取数据使用react,这是表的代码:

class Table1 extends Component {
render() {
return (
<div>
<BootstrapTable data={this.props.data}>
<TableHeaderColumn isKey dataField='id'>
</TableHeaderColumn>
<TableHeaderColumn dataField='name'>
</TableHeaderColumn>
<TableHeaderColumn dataField='value'>
</TableHeaderColumn>
</BootstrapTable>
</div>
);
}
}

export default Table1;

这只是我在教程网站上找到的一个简单的表格代码,这就是我将数据传递给 dable 的方式:

var data = [
{name: "username"}
];

  render() {
return (
<body className = "aa">
<div>
<div className = "bb">
<Table1 data={data}/>
</div>
</div>
</body>
);
}

并成功在表中显示“用户名”,很好,但现在我想显示我的 Firebase 数据库中的所有用户名,这就是我从 Firebase 接收它的方式:

componentDidMount() {
db.onceGetUsers().on("child_added", snap =>{
var username = snap.child("name").child("name").val();
})
}

所以..我被困住了,因为我完全知道如何将这个var username数据放入我的表中,我是网络应用程序的新手,甚至没有谈论React..所以拜托,可以有人帮我弄清楚吗?

最佳答案

嗯。

firebase 的响应存储到 state 中并根据需要使用它

喜欢。

     constructor() {
this.state = {
responseFromFirebase: type of response....
}
}
componentDidMount() {
db.onceGetUsers().on("child_added", snap =>{
var username = snap.child("name").child("name").val();

this.setState({responseFromFirebase: username})
})
}

然后使用 state 响应,例如 this.state.responseFromFirebase

就是这样。简单的!

关于javascript - React.js 和 Firebase 如何在我的 bootstraptable 中显示数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49946636/

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