React@16.x(26)useContext

目录

  • 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>;
}

以上。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/28016.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Transformer系列:图文详解Decoder解码器原理

从本节开始本系列将对Transformer的Decoder解码器进行深入分析。 内容摘要 Encoder-Decoder框架简介shifted right移位训练解码器的并行训练和串行预测解码器自注意力层和掩码解码器交互注意力层和掩码解码器输出和损失函数 Encoder-Decoder框架简介 在原论文中Transformer用…

论文发表CN期刊《高考》是什么级别的刊物?

论文发表CN期刊《高考》是什么级别的刊物&#xff1f; 《高考》是由吉林省长春出版社主管并主办的省级教育类期刊&#xff0c;期刊以科教兴国战略为服务宗旨&#xff0c;专门反映和探索国内外教育教学和科研实践的最新成果。该期刊致力于为广大教育工作者提供一个高质量的学术…

idea自定义注释模板

1、打开配置 setting -> Editor -> Live Template 2、添加TemplateGroup&#xff0c;并在添加的TemplateGroup下加LiveTemplate 3、配置Live Template 内容&#xff1a; **** Description: * $param$* return $return$ * author $user$* date $date$ $time$**/变量…

oracle RAC安装 保姆级教程

使用SSHXmanager 我的本地IP是172.17.68.68 服务器配置 [rootrac12-1 ~]# cat /etc/hosts 127.0.0.1 localhost localhost.localdomain localhost4 localhost4.localdomain4 ::1 localhost localhost.localdomain localhost6 localhost6.localdomain6 #Public IP …

ARP协议相关

把ip地址解析成mac地址这里的mac地址就是路由器的mac地址 免费ARP 源ip和目的ip都是一样的&#xff0c;那怎么让其他人更新arp表呢&#xff1f;&#xff1f; 是因为目标mac是全f&#xff0c;是一个广播报文 如果冲突就是ip一样但是mac又不一样 代理ARP pc1和pc4是在同一个子网…

MySQL安全性策略:用户认证与数据加密

用户认证 定义和重要性 在数据库管理系统中&#xff0c;用户认证是关键的安全策略之一。用户认证意味着验证一个用户是否有权访问数据库系统。这对于确保只有合法用户可以访问和修改数据至关重要&#xff0c;它可以防止未经授权的访问和潜在的数据损坏。 MySQL用户账号管理…

【什么是几度cms,主要功能有什么】

几度CMS内容管理框架是基于 PHP 语言采用最新 Thinkphp 作为开发框架生产的网站 内容管理框架&#xff0c;提供“电脑网站 手机网站 多终端 APP 接口”一体化网站技术解 决方案。她拥有强大稳定底层框架&#xff0c;以灵活扩展为主的开发理念&#xff0c;二次开发方便且…

分库分表实践:单 KEY 业务场景

前言 ​ 随着业务的快速增长和数据量的爆炸性增加&#xff0c;传统的单体数据库架构已经难以满足性能和扩展性的需求。为了解决这一问题&#xff0c;分库分表技术应运而生&#xff0c;成为支撑大规模业务的重要手段。 分库分表方式 中间件 Cobar&#xff1a;阿里巴巴开发的…

C++格式化库fmt使用方法

1. 格式化库fmt简介 fmt github地址 api说明 格式化参数说明 内容的格式化&#xff0c;体现在代码中主要表现为字符串、基本类型、自定义类型的拼接。例如说打印日志、拼接变量等。C中我们会经常使用类似printf,snprintf(C风格使用不方便),std::string.append(繁琐), std::io…

[DDR4] DDR1 ~ DDR4 发展史导论

依公知及经验整理&#xff0c;原创保护&#xff0c;禁止转载。 专栏 《深入理解DDR4》 内存和硬盘是电脑的左膀右臂&#xff0c; 挑起存储的大梁。因为内存的存取速度超凡地快&#xff0c; 但内存上的数据掉电又会丢失&#xff0c;一直其中缓存的作用&#xff0c;就像是我们的工…

四川汇聚荣聚荣科技有限公司是干什么的,拼多多运营如何做?

四川汇聚荣聚荣科技有限公司是干什么的&#xff0c;拼多多运营如何做?随着电商行业的快速发展&#xff0c;越来越多的企业开始涉足这一领域。其中&#xff0c;四川汇聚荣聚荣科技有限公司便是其中的一员。那么&#xff0c;这家公司究竟是做什么的呢?简单来说&#xff0c;它是…

WSL Ubuntu安装TensorFlow-GPU、PyTorch-GPU

在Windows 11的WSL Ubuntu中安装TensorFlow-GPU、PyTorch-GPU 0、WSL Ubuntu安装 在Windows 11的商店中下载即可&#xff0c;此处以Ubuntu22.04.3为例 1、CUDA Toolkit安装 参考公孙启的文章Windows11 WSL Ubuntu Pycharm Conda for deeplearning前往nVidia官网下载CUDA …

前端面试题日常练-day70 【面试题】

题目 希望这些选择题能够帮助您进行前端面试的准备&#xff0c;答案在文末 TypeScript中&#xff0c;以下哪个关键字用于声明一个变量的类型为元组类型&#xff1f; a) tuple b) array c) object d) record 在TypeScript中&#xff0c;以下哪个符号用于声明一个变量的类型为函…

代码随想录算法训练营刷题复习2 :动态规划——打家劫舍系列+买卖股票系列

复习刷题第二天&#xff1a;动态规划——打家劫舍系列买卖股票系列 一、打家劫舍系列&#xff1a; 主要设置限定条件不能选择连续的两个值&#xff0c;这里判断偷不偷第(i)家&#xff0c;取决于 偷(i-1) 与 偷(i-2) (i)哪种情况划得来 198.打家劫舍 213.打家劫舍Ⅱ 这个题的…

靠谱放心!康姿百德柔压磁性豪华枕质量大揭秘

康姿百德柔压磁性豪华枕&#xff0c;舒爽透气呵护青春期娇嫩肌肤 良好的睡眠对青少年的生长发育至关重要&#xff0c;想要获得高质量睡眠&#xff0c;除了选择合适的床垫之外&#xff0c;一款合适的枕头同样是打造优质睡眠环境的重要一环。康姿百德集团有限公司深耕睡眠领域已…

记录认识相亲对象的帖子——之一——困惑金钱

我的提问&#xff1a; 我经常觉得我连自己都养不活&#xff0c;还负责了10多w, 作为中国的父母&#xff0c;他们强烈认为亲戚给我介绍一个对象&#xff0c;我就要主动积极的去联系女方&#xff0c;我对自己有比较清楚的认识。认为自身条件太差&#xff0c;然后我不愿意花钱给女…

electron模板【lectron-react-boilerplate】多窗口配置【HtmlWebpackPlugin】多页面配置

如果您正在使用electron-react-boilerplate进行快速的Electron应用程序开发,您可能会遇到想要在桌面应用程序中拥有多个原生窗口的情况。 MacOS窗口图像由OpenClipart-Vectors提供,来源Pixabay。 开始之前需要提及的事情! Electron有一个主进程和渲染进程的模式。可以有多个…

47-4 内网渗透 - MSF介绍

一、MSF简介 Metasploit框架(Metasploit Framework, MSF)是一款开源工具,专为渗透测试设计。它由Ruby编程语言编写,具有高度的扩展性,可以方便渗透测试人员开发和使用定制化的工具模板。 Metasploit提供多种接口来控制测试过程,包括控制台、Web界面和命令行界面(CLI)。…

【博客718】时序数据库基石:LSM Tree(log-structured merge-tree)

时序数据库基石&#xff1a;LSM Tree(log-structured merge-tree) 1、为什么需要LSM Tree LSM被设计来提供比传统的B树更好的写操作吞吐量&#xff0c;通过消去随机的本地更新操作来达到这个目标&#xff0c;使得写入都是顺序写&#xff0c;而不是随机写。 那么为什么这是一个…

Redis在互联网大厂中的应用案例分析

携程金融的Redis架构 携程金融在经过多年的演进后,形成了多层次的系统架构,其中基础数据(如用户信息、产品信息、订单信息等)由底层系统产生,并服务于所有的金融系统。这些基础数据通过统一的缓存服务(系统名utag)进行缓存。缓存数据具有全量、准实时、永久有效的特点,…