反应功能组件，如何在删除数据后重新渲染-Java 学习之路

尝试使用按钮从列表视图中删除数据库中的项目 .

单击时会删除数据，但组件不会从页面中删除 .

删除之后我该如何重新渲染呢？

我没有使用redux

const EmailItem = ({email}) => (

  <div>
    <h3>{email}</h3>
    <button
      onClick={(e) => {
      e.preventDefault()
      axios.delete("/api/emails/delete/", {
        data: {email: email}
      })
      }
    }
    >
      Remove
  </button>
  </div>
)

导出默认值（EmailItem）

1 回答

在props中传递处理程序/回调作为来自父项的onDelete . 在axios成功中调用onDele会调用在父级中定义的回调体......在本质上你将有条件状态来显示或隐藏这个组件 .

Parent extends React.component {
constructor {
    this.state={
      showEmail: true
    }
}
hideEmail =()=>this.setState({showEmail:false})
render(){
this.state.showEmail && {
<EmilItem onDelete={hideEmail} email = {your email}/>
}
}

然后将现有的EmailItem更改为：

const EmailItem = ({email, onDelete}) => (

和处理程序：

onClick={(e) => { e.preventDefault();   

axios.delete("/api/emails/delete/",    { data: {email: email} }).then(){
onDelete()
} }

回复于 2024-04-27T05:08:58+08:00

反应功能组件，如何在删除数据后重新渲染

1 回答

相关问题