useContext

今天来説说useContext，这个东西可以做成破产版的redux ，主要功能是建立一个global的树避免产生一个'Props Hell'

先用一段简单的code

// 我是写了一个空物件，但其实这是预设值，写什麽都可以，当<Provider value={} />
// 没有assign value时会预设使用这个
const SomethingContext = createContext({});

然後接下来，如何丢值到整棵树，就要利用context的provider

<SomethingContext.Provider value={...value} />

有写过redux的人，应该感觉很熟悉齁，对他就是概念很像，透过value的props传递到各个子层，还有一个很重要的点/

如果value的值更改了， 所有的children都会重新re-render

接下来如何取得provider传下来的值

1. 使用render props

<SomethingContext.Consumer>
	{(value) => {}}
</SomethingContext.Consumer>

1. 使用useContext

const [value, dispatch] = useContext(SomethingContext);

好用的displayName在debug好用

还有很多好用的 下回待续，待想好一个主题