我有一个带有子组件的 react 表, 在子组件中,我有 2 个按钮,点击每个按钮需要显示 react 表, 请帮我解决这个问题。
ex:
class Sample extends React{
firstFun=()=>{
return <ReactTable data={} columns={columns}
}
secondFun=()=>{
return <Reacttable data={} columns={columns}
}
subcompo=()=>{
// some code
<bt1 onclick={this.firstFun}/>
<bt2 onclick={this.secondFun}/>
}
render(){
return(
<ReactTable
data={}
submcomponent={this.subcompo}
/>
)}
}
最佳答案
您可以使用 bool 值设置按钮被点击和激活的状态,并显示不同的表格。 是否与您正在寻找的类似:
class Sample extends React {
state = {
firstButtonActive: false,
secondButtonActive: false
}
handleFirstButtonClick = () => {
this.setState({ firstButtonActive: !this.state.firstButtonActive})
}
handleSecondButtonClick = () => {
this.setState({ secondButtonActive: !this.state.secondButtonActive })
}
subcompo = () => {
// some code
<bt1 onclick={this.handleFirstButtonClick} />
<bt2 onclick={this.handleSecondButtonClick} />
}
render() {
const { firstButtonActive, secondButtonActive } = this.state;
return (
<>
<ReactTable
data={}
submcomponent={this.subcompo}
/>
{firstButtonActive && <ReactTable data={} columns={columns}/>}
{secondButtonActive && <ReactTable data={} columns={columns} />}
</>
)
}
}
关于javascript - 在按钮上单击显示 react 表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59108031/