React全局变量

简介: React全局变量

React全局变量容器

// Provider
import { createContext } from 'react'
export const TestContext = createContext<any>(null)
export const ContainerContext = createContext<any>(null)
// 设置全局包裹
import { TestContext } from './Provider'
const confDrawer: any = usekef(null)
...
return (
<TestContext.Provider
  value={{ confDrawerShow: confDrawer.current?.show, }}
  <ConfEditDrawer ref={confDrawer} />
</TestContext.Provider>
// 使用
import { TestContext } from '../../Provider';
const { confDrawerShow }= useContext<any>(TestContext)
const onFn = () => {
  confDrawerShow('edit',{ data: xxxx })
}
目录
相关文章
|
6月前
|
存储 前端开发 JavaScript
【第34期】一文学会React组件传值
【第34期】一文学会React组件传值
74 0
|
6月前
|
前端开发 JavaScript
react 生命周期函数
react 生命周期函数
|
前端开发
react hooks 使用小技巧—useState传值函数
当使用useState时,传入一个函数作为初始状态值的参数和传入一个值的参数的效果是一样的,都会在组件渲染时被调用,但它们的使用场景略有不同。
605 1
|
3月前
|
前端开发 JavaScript API
|
6月前
|
前端开发 JavaScript
react生命周期函数
react生命周期函数
35 0
|
前端开发 JavaScript API
react 如何创建全局变量
在 React 应用中创建全局变量一般有两种方式: 常规 JavaScript 方式
1468 0
|
前端开发
react项目调用函数
React项目中调用函数有多种方式,以下是其中的几种: 直接在组件中调用
93 0
|
存储 自然语言处理 前端开发
深入理解React与闭包的关系
深入理解React与闭包的关系
162 0
|
前端开发 API
React 函数组件详解
React 函数组件详解
94 0
|
前端开发 JavaScript API
React函数化的 Hooks
React函数化的 Hooks
212 37