getInitialState()替换现有状态.如何在React中传递现有状态

getInitialState() replacing existing state. How to pass existing state in React?

本文关键字：状态 React getInitialState 替换      更新时间：2023-09-26

我正在制作一些按钮，这些按钮将根据数据库的状态显示某个类。

我已经通过一个发射器传递了我的API结果，并使用下面的方法进入我的状态:

  constructor(props) {
    super(props);
    this.state = {
      tickets: [],
      user: []
    };
    this.onGetAllTickets = this.onGetAllTickets.bind(this);
    this.onGetCurrentUser = this.onGetCurrentUser.bind(this);
  }

然而，我必须使用getInitialState()选项在我的按钮中设置一个新状态。我的按钮看起来像这样:

const AssignButton = React.createClass({
  getInitialState() {
    return {
      isPressed: false,
      completeStatus: "Assign"
    };
  },
  handleClick() {
    this.setState({
      isPressed: true,
      completeStatus: "Assigned",
    });
  },
  render () {
    var assignClass =  'ui orange right floated button assign';
    //THIS IS WHERE I AM TRYING TO CHECK TICKET STATUS 
    if(this.state.tickets.status === 2) assignClass = 'ui green right floated button done disabled';
    else if(this.state.isPressed) assignClass += ' disabled';
    return <button className={assignClass} onClick={this.handleClick}>{this.state.completeStatus}</button>;
  }
});

然而，通过this.state.tickets.status会产生以下结果:

TicketeesBoard.js:123 Uncaught (in promise) TypeError: Cannot read property 'status' of undefined(…)

我假设这是因为我的状态被getInitialState()方法覆盖了。

this.state.tickets.status等在AssignButton组件之外工作。

我如何将我的票从原始状态传递到getInitialState()方法?

问题是您试图访问另一个组件的状态。您正在寻址this.state.tickets.status，其中票状态未在AssignButton中声明

你有两个组成部分。TicketBoard,AssignButton。你在TicketBoard中设置了票的状态你试图在AssignButton

中访问它

尝试通过props将ticket状态传递给assignButton，并将条件从this.state.tickets.status更改为this.props.tickets.status。此外，请确保在空数组上调用.status时不会出现问题。

相关文章：