目录
- 1,上下文的使用
- 2,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>;
}
以上。