五、useContext提供者

在React中组件间的数据通信是通过props进行的，父组件给子组件设置props，子组件给后代组件设置props，props在组件间自上向下（父传子）的逐层传递数据。但并不是所有的数据都适合这种传递方式，有些数据需要在多个组件中共同使用，如果还通过props一层一层传递，麻烦自不必多说。

Context类似于JS中的全局作用域，可以将一些公共数据设置到一个同一个Context中，使得所有的组件都可以访问到这些数据。

import React from "react
const CartContext =React.createContext({
	...属性,
	...方法
})
export default CartContext;

2.设置provider提供者

在拥有数据的组件里面导入刚刚的js文件，命名为CartContext

//把要提供的数据写在value里面
<CartContext.Provider value={数据}>
	子组件
</CartContext>

3.在要使用数据的子/孙/...组件里面使用

在拥有数据的组件里面导入刚刚的js文件，命名为CartContext

import React, {useContext} from "react";
//在组件里面使用勾子函数
const ctx=useContext(CardtContext);
//调用属性
ctx.name;
//调用方法
ctx.setName(name);

4.注意事项

1.组件一定要大写！！！ 2.value里面的值一定要对应上！！！

五、useContext提供者 ​