时间戳

首页 > 解决方案 > 删除 React 中的对象实例：“汽车”返回未定义

reactjs - 删除 React 中的对象实例：“汽车”返回未定义

问题描述

我正在尝试更新我的应用程序，以便显示的每辆汽车都带有一个删除按钮，该按钮会在单击时从数据库中删除汽车。

在我的 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？

标签： reactjs

解决方案

1.您需要将汽车置于这样的状态：

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

但问题是数据，您需要将数据作为道具提供给删除组件。

然后从道具中获取数据而不是从状态中获取数据。

2.然后onDelete函数更新状态：

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

推荐阅读