1. contxet使用场景：例如一些公共信息（语言、主题）的传递时候，觉得使用props太繁琐和使用redux小题大做的时候会使用context
    2. 类组件中的使用 ```jsx import styles from ‘./index.less’; import React, { Component, createContext } from ‘react’

    const BatteryContext = createContext(0); //创建createContext实例对象，必须传一个默认值,默认值的意义就是Consumer向上找不到对于的Provider就会展示该默认值 const OnlineContext = createContext(false);

    class Leaf1 extends Component { render() { return ( { battery => ( { online =>

    Battery:{battery},Online:{String(online)}

    } ) } // Consumer用于接收Provider提供的变量值 // 在Consumer不能直接渲染其他组件，必须声明一个函数，改函数的唯一参数就是BatteryContext的value值 ) } }

    class Leaf2 extends Component { static contextType = BatteryContext //将BatteryContext实例对象赋值给静态属性contextType

    render() { const battery = this.context //设置了contextType之后Leaf组件在运行时候就会获得一个新的属性this.context //从而无需再使用BatteryContext.“Consumer return (

    Battery:{battery}

    ) } }

    // 函数组件中不可以使用静态属性contextType，因为函数组件无法获取this.context，只能使用Consumer // 因为函数式组件没有实例，即没有 this

    class Middle extends Component { render() { return ( ) } }

    export default class IndexPage extends Component { state = { online: false, battery: 60, }; render() { const { battery, online } = this.state; return (

    {/ BatteryContext对象 派生出 “Provider”生产者 和 “Consumer 消费者” /} {/ BatteryContext对象必须要有一个值 /} {/ 当BatteryContext对象的value值改变，就会跨域层级，提醒Consumer进行重渲染 /} {/ 如果有多个Context，直接嵌套起来即可,顺序不重要 /}
    ); } }

    ```