Блог

Я пытаюсь обновить свое приложение, чтобы на каждом отображаемом автомобиле была кнопка удаления, которая удаляла бы автомобиль из базы данных при нажатии.

В моем компоненте deleteButton у меня есть следующее, которое выдает мне сообщение об ошибке car is not defined :

 import React from 'react';

class DeleteButton extends React.Component {
constructor() {
    super();
        this.state = {
        };
        this.handleClick = this.handleClick.bind(this);
}

delete(car){
    const data = this.state.data.filter(i => i.id !== car.id)
    this.setState({data})
  }

render() {
    const label = 'Delete';
        return (
            <button className="delete-btn" onClick={this.delete.bind(this, car)}>{label}</button>
        );
    }
}

export default DeleteButton;
  

Как я должен определять car ?

1. Вам нужно перевести car в состояние, подобное этому:

     this.state = {
      car: {
        id: ''
      },
    };
  

Но проблема в данных, вам нужно предоставить данные в качестве реквизитов для компонента удаления.

И затем из реквизитов извлекаются данные не из состояния.

2. Затем функция OnDelete обновляет состояние:

 delete(car){
    const data = this.props.data.filter(i => i.id !== car.id)
    this.setState({car: data})
  }