想点击一个按钮的时候再新增加一个table
在state
上添加一个参数,根据参数判断是否展示table,点击按钮的时候修改这个state
render(){
let {show} = this.state;
return (
<div>
<button onClick={()=>{this.setState({show:true})}}>点击</button>
{show && <table></table>}
</div>
)
}
React使用属性和状态来渲染UI模型。假设你的每行的数据具有name, job, telephone number, phone number, email
五个字段。虚构一个数据模型,像这样:
[
['赵四','搬运工','76543210','13910733521','zs@xx.com'],
['马麦皮','演员','123456788','13910733520','mmp@xx.com'],
]
因为这个数据是会被修改的,所以把它作为状态,假设某个时刻状态是这样的:
this.state = {
users: [
['赵四','搬运工','76543210','13910733521','zs@xx.com'],
['马麦皮','演员','123456788','13910733520','mmp@xx.com'],
]
}
要添加一行,只需要向数组内添加数据即可,这时候要注意[数据不可变性]:(https://facebook.github.io/re...
addDate (data) {
this.setState({
users: this.state.users.slice(0).push(data)
})
}
修改后的数据可能是这样的:
this.state = {
users: [
['赵四','搬运工','76543210','13910733521','zs@xx.com'],
['马麦皮','演员','123456788','13910733520','mmp@xx.com'],
['董瓜丕','管道工','66666666','13733333333','xgp@xx.com']
]
}
把数据结构在render中渲染出来即可。
4 回答1.6k 阅读
2 回答1.1k 阅读✓ 已解决
2 回答2.6k 阅读
1 回答948 阅读✓ 已解决
1 回答678 阅读✓ 已解决
2 回答839 阅读✓ 已解决
2 回答1k 阅读
可以通过一个
Number
来对 table 进行计数,然后通过setState
更新。查看:一个简单的 Demo