在React 16中无法通过this.context访问contextType

时间:2018-11-12 07:31:18

标签: reactjs

尝试新的Context API时遇到一个问题,即我无法访问在我的课程中通过React.createContext创建的上下文。

一个简单的例子是

const AppContext = React.createContext("blue"); /* creating context  */


export class App extends React.Component {
  static contextType = AppContext; /* setting context type */

  render() {
    console.log(this.context); /* trying to access */
    return (
      <div>
        <p>Hello World</p>
      </div>
    );
  }
}

我的期望是console.log应该打印为“ blue”,但是我只得到{}。我仍然可以通过AppContext.Consumer访问上下文值。

我要去哪里错了?

可以在此处看到更详细的示例-https://codesandbox.io/s/217jml9nlr

1 个答案:

答案 0 :(得分:4)

您尚未将react-dom更新为与React相同的版本,即16.6,因此您会看到这种意外的行为。 react和react-dom应该使用相同的版本

static contextType API仅从版本16.6开始受支持。

Working codesandbox