React@16.x（26）useContext

1，上下文的使用

之前的文章中介绍过 context上下文。

使用举例：

import React, { useState } from "react";const ctx = React.createContext();function Child() {return <ctx.Consumer>{(value) => <div>{value}</div>}</ctx.Consumer>;
}export default function App() {return (<ctx.Provider value="123"><Child></Child></ctx.Provider>);
}

2，useContext

在之前的做法中，有一些不舒服的点，一是增加了嵌套的层级；二是使用起来有点麻烦。

对比 useContext：

import React, { useContext } from "react";function Child() {const value = useContext(ctx);return <div>{value}</div>;
}

---

以上。