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组件传值
35 0
|
6天前
|
前端开发 JavaScript
react 生命周期函数
react 生命周期函数
|
7月前
|
前端开发
react hooks 使用小技巧—useState传值函数
当使用useState时,传入一个函数作为初始状态值的参数和传入一个值的参数的效果是一样的,都会在组件渲染时被调用,但它们的使用场景略有不同。
282 1
|
6天前
|
前端开发 JavaScript
react生命周期函数
react生命周期函数
11 0
|
9月前
|
前端开发
react项目调用函数
React项目中调用函数有多种方式,以下是其中的几种: 直接在组件中调用
73 0
|
9月前
|
前端开发 JavaScript API
react 如何创建全局变量
在 React 应用中创建全局变量一般有两种方式: 常规 JavaScript 方式
936 0
|
9月前
|
JavaScript
Vue3中怎么设置全局变量
Vue3中怎么设置全局变量
|
10月前
|
前端开发 API
React 函数组件详解
React 函数组件详解
70 0
学习Vue3 第二十九章(Vue3定义全局函数和变量)
学习Vue3 第二十九章(Vue3定义全局函数和变量)
96 0
|
前端开发 JavaScript API
React中StrictMode严格模式
React中StrictMode严格模式
106 0
React中StrictMode严格模式