如何将常量放入React组件中,并进行重组

时间:2018-08-15 18:45:14

标签: javascript reactjs static

如何编写可以设置this.state.status的组件特定常量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);

2 个答案:

答案 0 :(得分:1)

由于STATUS是课程的static property,因此您必须按以下方式进行访问:

this.constructor.STATUS.SENT

如果您将其声明为实例的属性,则可以通过this.status进行访问:

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

或通过getter

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

答案 1 :(得分:0)

为什么不直接将SENTError设置为您的状态?

喜欢这个:

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

直接像这样设置状态后:

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

欢呼