如何通过onjlick在reactjs中删除提取行

时间:2017-05-15 05:51:20

标签: javascript reactjs web

我是新手,我不知道如何使用fetch删除一行..我已经弄乱了代码我不知道它现在会如何工作请帮助我这么丢失...

renderItem(d, i) {
      return <tr key={i} >
      <td> {d.Employee_ID} </td>
            <td>{d.Employee_Name}</td>
            <td>{d.Address }</td> 
            <td><center><button className ="btn btn-info" onClick={this.handleOnclick.bind(this,  d.Employee_ID, d.Employee_Name, d.Address)}   data-toggle="modal" data-target="#UpdateEmployee">Edit</button></center></td>
            <td><center><button className ="btn btn-danger" onClick={this.deleteEmployee.bind(this,  d.Employee_ID)}>Delete</button></center></td>
     </tr>
    }

    handleOnclick(id,name,address) {


     this.setState({
        Employee_Name: name,
        Address: address,
      });
      }

    deleteEmployee(id) {
        debugger
          fetch ('http://localhost:5118/api/employeedetails/deleteemployeedetail/'+ id,
          { method: 'DELETE',})
          .then( 
              res =>  this.setState({jsonReturnedValue : json})
          )
          .catch( err => cosole.error(err))                
      }  

1 个答案:

答案 0 :(得分:0)

从api中删除元素后,您还需要将其从状态中删除,假设您正在从状态employee渲染表格。然后你需要做

deleteEmployee(id) {
    debugger
      fetch ('http://localhost:5118/api/employeedetails/deleteemployeedetail/'+ id,
      { method: 'DELETE',})
      .then( 
          res =>  {
              this.setState({jsonReturnedValue : json})
              var employee = [...this.state.employee];
              var idx = employee.findIndex(item => item.Employee_ID === id);
              employee.splice(idx, 1);
              this.setState({employee})

         }
      )
      .catch( err => cosole.error(err))                
  }