react 入坑学习(八)Hooks React 父组件向子组件传值

news/2024/7/10 23:14:43 标签: javascript, reactjs, es6, npm, ant

父组件

javascript">import {createContext} from 'react';
import SearchPart from './searchpart';  //引入子组件

export const FatherContext = createContext();

function ant">AAA(){
	const [ant">AA, setAA] = useState(Array);
	const ant">BB= useSelector(state => state.ant">BB.data);
	.....
	return (
	   <div>
	     <FatherContext.Provider
	       value={{
	         ant">AAA: ant">AA,
	         ant">BBB: ant">BB,
	       }}
	     >
	       <SearchPart/>  //子组件
	     </FatherContext.Provider>
	     <div>
	 )
	 .....
}

子组件

javascript">import {useContext} from 'react';
import { FatherContext } from './index';
function SearchPart(){
	const ant">AAA=useContext(FatherContext).ant">AAA;
	const ant">BBB=useContext(FatherContext).ant">BBB;
	......
}

就可以直接使用了

新手小白,如果有帮助到你,能点个赞嘛!!谢谢!!!


http://www.niftyadmin.cn/n/1485426.html

相关文章

kettle学习笔记(三)——kettle资源库、运行方式与日志

一、kettle资源库 资源库是用来保存转换任务的&#xff0c;用户通过图形界面创建的的转换任务可以保存在资源库中。 资源库可以使多用户共享转换任务&#xff0c;转换任务在资源库中是以文件夹形式分组管理的&#xff0c;用户可以自定义文件夹名称。 1.ketle资源库元数据 • 资…

mongodb3 重启_冰点还原的安装配置,每次重启就会还原系统软件。

1.首先我们要下载一个冰点还原系统软件&#xff0c;下载网址&#xff1a;https://yto6688.ctfile.com/fs/20078289-3691619752.下载完成之后---我们要安装这个软件--打开软件--下一步3.接受协议4.会出现输入密钥的对话框&#xff0c;如果有就可以输入&#xff0c;我这里给大家弄…

MKAnnotationView,MKAnnotation与MKMapView结合使用显示坐标点

http://blog.iosxcode4.com/archives/74 ☉限制&#xff1a;必须将iPhone的操作系统更新到ios3.0版本&#xff0c;开发使用的SDK也要是SDK 3.0才有內建Mapkit Framework。 ☉效果画面&#xff1a; ☉步骤说明&#xff1a;在 地图上每一个记号&#xff0c;都是一個MKAnnotationV…

iVMS-4200 Vs区别_5G科普篇五 |5G网络和4G网络的区别,你真的都了解吗?

5G与4G的区别&#xff0c;就多1“G”&#xff1f;5G和4G&#xff0c;虽然&#xff0c;就相差了1个”G”&#xff0c;但它带来的变化却是重量级的改变。“G”指是“generation”&#xff0c;俗称为更新换代。1代。手机只用来打电话&#xff1b;2代。手机主要用来发短信、看文字&…

xpinyin-函数返回多个值-lambda匿名函数-列表生成式-三元表达式

import xpinyinpxpinyin.Pinyin() #实例化print(p.get_pinyin(小白,))函数返回多个值&#xff1a;1、函数如果返回多个值的话&#xff0c;它会把这几个值放到一个元组里2、函数如果返回多个值的话&#xff0c;也可以用多个变量来接收def say(): num1 1 num2 2 num3 3 retu…

python爬虫实例_Python数据分析及可视化实例之爬虫源码(04)

系列文章总目录&#xff1a;yeayee&#xff1a;Python数据分析及可视化实例目录​zhuanlan.zhihu.com1.背景介绍&#xff08;1&#xff09;接上一弹留下的作业&#xff0c;使用Cookies免密码登录今日头条&#xff0c;并针对上一节采集的URL自动POST一条回复&#xff0c;经测试&…

react 入坑学习(十)悬浮消息提示按钮

大致写了一下&#xff0c;挺粗糙的 import {BellOutlined } from ant-design/icons import {Badge, Affix } from antd; .... return( <Affix offsetTop{60} style{{position:absolute ,top:60, left:95%}}>// <a href"#"><Badge count{5}><Bu…

客户端存在潜在危险request.from

文本框中输入<br>等一些字符串会出现如上图的错误&#xff1b; 解决方案&#xff1a;在WEB.CONFIG文件中添加配置文件 <system.web> <pages validateRequest"false"/> </system.web>