如何將常量放入React組件中，並進行重組

Question

如何編寫特定於組件的常量STATUS，可以設置this.state.status ？ 我認為問題在於這種情況。 如果this.STATUS硬編碼為字符串，則可以使用。

import { compose } from 'recompose';
import React, { Component } from 'react';

class TestComponent extends Component {
    static propTypes = {};

    // can you put the STATUS constant on the component?
    static STATUS = {
        SENT: 'SENT',
        ERROR: 'ERROR',
    };

    state = { status: null };

    // functions cannot use this.STATUS
    f = () => {
        this.setState({status: this.STATUS.SENT});
        // undefined is not an object (evaluating '_this.STATUS.SENT')
    }

    render() {
        const { msg } = this.statusMessage();
        return ();
    }

}

export default compose(
  withRouter,
  connect(() => ())
)(TestComponent);

Answer 1

因為STATUS是該類的靜態屬性 ，所以您必須按以下方式訪問它：

this.constructor.STATUS.SENT

如果您將其聲明為實例的屬性，則可以通過this.status訪問它：

STATUS = {
  SENT: 'SENT',
  ERROR: 'ERROR',
};

或通過吸氣劑 ：

get STATUS() {
  return {
    SENT: 'SENT',
    ERROR: 'ERROR'
  };
}

Answer 2

為什么不直接將SENT和Error設置為狀態？

像這樣 ：

this.setState({
 SEND: 'SENT'
 ERROR: 'ERROR'
 status: null
});

然后像這樣直接設置狀態：

f = () => {
    const { SENT } = this.state
    this.setState({status: SENT});
}

干杯