使用this.state时变得不确定。在jsx上渲染（笑话/酶）

Question

我当前正在定义一个组件，并使用默认值创建一些状态值。特别是一个对象，特别是这个对象在componentDidMount上“重新生成”。代码就像一个魅力，当我为此编写测试时，问题就来了。我看到的问题是未在render（）上定义“ this”。

//component
class HealthGrades extends Component {
  constructor(props) {
    super(props);
    this.onBtnCk = this.onBtnCk.bind(this);
    this.state = {
      tabKey: ‘record’,
      tabData: [],
      tblCol,
      patId:null    
    };
  }

  componentDidMount() {
    this.props.fetchHealthTabsData(this.props)
      .then(() => {

        this.setState({
          tabData: getTabData(this.props.drInfo, this.state.tabKey),
          tblCol: modelUtils.fetchNewObj(tblCol, 
          this.props.patientData.data.patientType),
        });
      });
  }

  render() {
    return (

        <DataGrid
          cols={this.state.tblCol[this.state.tabKey]} //complains that 'this' is undefined (first one)
          rows={this.state.tabData}
          isActive={this.props.isActive}

        />


)}

试图了解为什么我在测试“ this.state.tblCol”中进行渲染的时间始终未定义：

  const wrapper = shallow(<HealthGrades {...props} />);