contexttypes json 代码示例

contextTypes是React组件中的一个静态属性，用于定义组件所需的上下文类型。上下文（context）是React组件树中的一种全局变量，可以在组件之间共享数据，避免了通过props一层层传递数据的麻烦。

在组件中定义contextTypes属性，可以指定该组件所需的上下文类型。contextTypes是一个对象，对象的属性是上下文中的数据，属性的值是对应数据的类型。

示例代码如下：

import React from 'react';
class MyComponent extends React.Component {
  static contextTypes = {
    name: PropTypes.string,
    age: PropTypes.number
  };
  render() {
    const { name, age } = this.context;
    return (
      <div>
        <p>Name: {name}</p>
        <p>Age: {age}</p>
      </div>
    );
  }
}

在上面的示例中，MyComponent组件定义了一个contextTypes属性，指定了所需的上下文类型。该组件需要从上下文中获取name和age两个数据，因此在contextTypes对象中定义了name和age两个属性，并指定了它们的类型为string和number。

在组件的render方法中，可以通过this.context来访问上下文中的数据。在上面的示例中，我们通过解构赋值的方式获取了name和age，并在组件的渲染结果中展示了它们。

需要注意的是，使用contextTypes需要配合上下文提供者（context provider）一起使用，以确保上下文中的数据能够被正确地传递给组件。上下文提供者负责将数据注入上下文中，组件通过contextTypes来声明自己需要哪些数据。这样，当上下文中的数据发生变化时，组件会自动更新。