antd 源码分析 tabs

2024-11-03

antd源码分析之——标签页（tabs 2.Tabs关键组件功能实现）

由于ant Tabs组件结构较复杂,共分三部分叙述,本文为目录中第二部分(高亮) 目录一.组件结构 antd代码结构 rc-ant代码结构 1.组件树状结构 2.Context使用说明 3.rc-tabs中只在example.test中使用的组件说明二.Tabs关键组件功能实现 1.Tabs(antd) 2.RcTabs 3.Sentinel哨兵 4.InkTabBarNode 三.Tabs的滚动效果 ScrollableTabBarNode 二.Tabs关键组件功能实现 1.Tabs(an

antd源码分析之——标签页（tabs 1.组件结构）

由于ant Tabs组件结构较复杂,共分三部分叙述,本文为目录中第一部分(高亮) 目录一.组件结构 antd代码结构 rc-ant代码结构 1.组件树状结构 2.Context使用说明 3.rc-tabs中只在example.test中使用的组件说明二.Tabs关键组件功能实现 1.Tabs(antd) 2.RcTabs 3.Sentinel哨兵 4.InkTabBarNode 三.Tabs的滚动效果 ScrollableTabBarNode 一.组件组合结构 antd代码目录 rc-tab

antd源码分析之——栅格（Grid）

官方文档 https://ant.design/components/grid-cn/ 目录一.antd中的Grid 代码目录 1.整体思路 2.less文件结构图(♦♦♦重要) 3.less实现逻辑图(♦♦♦重要) 4.源码节选:antd/components/grid/style/mixin.less 5.源码节选:antd/components/grid/col.tsx 一.antd中的Grid Grid没有使用React 底层基础组件.Grid的特点在于css样式的控制,本次着重对cs

antd源码分析之——折叠面板（collapse）

官方文档 https://ant.design/components/collapse-cn/ 目录一.antd中的collapse 代码目录 1.组件结构图(♦♦♦重要) 2.源码节选:antd/components/collapse/collapse.tsx 3.源码节选:antd/components/collapse/CollapsePanel.tsx 二.RcCollapse 代码目录 1.组件内部属性结构及方法调用关系图(♦♦♦重要) 2.组件应用的设计模式(♦♦♦重要) 3.源码

antd源码分析之——标签页（tabs 3.Tabs的滚动效果）

由于ant Tabs组件结构较复杂,共分三部分叙述,本文为目录中第三部分(高亮) 目录一.组件结构 antd代码结构 rc-ant代码结构 1.组件树状结构 2.Context使用说明 3.rc-tabs中只在example.test中使用的组件说明二.Tabs关键组件功能实现 1.Tabs(antd) 2.RcTabs 3.Sentinel哨兵 4.InkTabBarNode 三.Tabs的滚动效果 ScrollableTabBarNode 二.Tabs的滚动效果 ScrollableTa

antd源码分析之——对话框（modal）

目录一.组件结构 1.antd代码结构 2.rc-ant代码结构 3.组件结构二.antd组件调用关系及功能详解 1.Model.tsx 2.confirm 三.rc-dialog详解 1.e.target 与 e.currentTarget 2.onMouseDown.onMouseUp 和 onClick 3.理解dialog中的鼠标事件 4.思维导图一.组件结构 1.ant代码结构 2.rc-ant代码结构 3.组件结构 ant中modal的index.tsx中引入了Modal和co

ANTD mobile源码分析 -- popover

最近的开发中要用到很多的各式各样的组件.但是发现ant design mobile(后面简称ANTDM)里很多的资源.于是就分析一下,学习学习. ANTDM直接使用了typescript,没有用ES2015,不过这不会是障碍,反而是学习typescript的一个好机会.基本上可以学的开源项目里比这个好的也不多. 目录结构 Popover组件在: | |--components | |--popover 我们要分析的组件全部都在components这个目录下. 在这个目录里还包含tests, de

Spark源码分析之Spark Shell（下）

继上次的Spark-shell脚本源码分析,还剩下后面半段.由于上次涉及了不少shell的基本内容,因此就把trap和stty放在这篇来讲述. 上篇回顾:Spark源码分析之Spark Shell(上) function main() { if $cygwin; then # Workaround for issue involving JLine and Cygwin # (see http://sourceforge.net/p/jline/bugs/40/). # If you're us

EasyUI学习总结(三)——easyloader源码分析(转载)

声明:这一篇文章是转载过来的,转载地址忘记了,原作者如果看到了,希望能够告知一声,我好加上去! easyloader模块是用来加载jquery easyui的js和css文件的,而且它可以分析模块的依赖关系,先加载依赖项.模块加载好了会调用parse模块来解析页面.把class是easyui开头的标签都转化成easyui的控件. 先看Demo1例子,再分析源代码. <!DOCTYPE html> <html> <head> <title>easyloader

vim 源码分析

vim 源码分析 http://bbs.csdn.net/topics/230031469 Ver7.1 晕.看不明白很正常. 7.1已经很大了. 支持了太多东西. 代码行数那么多(源码压缩了都6M多).没有linux编程经验,看懂难于登天(他的功能太强大,决定了他源码涉及面广,相对复杂.).工作需要的话,估计等你全部弄明白,都跳槽好几次了... 劝你看个低版本的. vi的源码好像不太好找(我没找到)~不过vim1.2x/1.X的代码还是很好找的.都很小.很容易读.而且功能也还算可以了..

ABP源码分析一：整体项目结构及目录

ABP是一套非常优秀的web应用程序架构,适合用来搭建集中式架构的web应用程序. 整个Abp的Infrastructure是以Abp这个package为核心模块(core)+15个模块(module).其中13个依赖于Abp这个核心包.另外两个包(FluentMigration,Web.Resources)相对独立 Abp.AutoMapper: 实现对象之间的自动映射. Abp.EntityFramework:通过EntityFramework实现数据访问层. Abp.FluentMigra

HashMap与TreeMap源码分析

1. 引言在红黑树--算法导论(15)中学习了红黑树的原理.本来打算自己来试着实现一下,然而在看了JDK(1.8.0)TreeMap的源码后恍然发现原来它就是利用红黑树实现的(很惭愧学了Java这么久,也写过一些小项目,也使用过TreeMap无数次,但到现在才明白它的实现原理).因此本着"不要重复造轮子"的思想,就用这篇博客来记录分析TreeMap源码的过程,也顺便瞅一瞅HashMap. 2. 继承结构 (1) 继承结构下面是HashMap与TreeMap的继承结构: pu

nginx源码分析之网络初始化

nginx作为一个高性能的HTTP服务器,网络的处理是其核心,了解网络的初始化有助于加深对nginx网络处理的了解,本文主要通过nginx的源代码来分析其网络初始化. 从配置文件中读取初始化信息与网络有关的配置命令主要有两个:listen和sever_name.首先先了解这两个命令的用法. listen listen命令设置nginx监听地址,nginx从这里接受请求.对于IP协议,这个地址就是address和port:对于UNIX域套接字协议,这个地址就是path. 一条listen指令只能

zookeeper源码分析之五服务端(集群leader)处理请求流程

leader的实现类为LeaderZooKeeperServer,它间接继承自标准ZookeeperServer.它规定了请求到达leader时需要经历的路径: PrepRequestProcessor -> ProposalRequestProcessor ->CommitProcessor -> Leader.ToBeAppliedRequestProcessor ->FinalRequestProcessor 具体情况可以参看代码: @Override protected v

zookeeper源码分析之四服务端(单机)处理请求流程

上文: zookeeper源码分析之一服务端启动过程中,我们介绍了zookeeper服务器的启动过程,其中单机是ZookeeperServer启动,集群使用QuorumPeer启动,那么这次我们分析各自一下消息处理过程: 前文可以看到在 1.在单机情况下NettyServerCnxnFactory中启动ZookeeperServer来处理消息: public synchronized void startup() { if (sessionTracker == null) { createSe

zookeeper源码分析之三客户端发送请求流程

znode 可以被监控,包括这个目录节点中存储的数据的修改,子节点目录的变化等,一旦变化可以通知设置监控的客户端,这个功能是zookeeper对于应用最重要的特性,通过这个特性可以实现的功能包括配置的集中管理,集群管理,分布式锁等等. 知识准备: zookeeper定义的状态有: Unknown (-1),Disconnected (0),NoSyncConnected (1),SyncConnected (3),AuthFailed (4),ConnectedReadOnly (5),Sasl

java使用websocket，并且获取HttpSession，源码分析

转载请在页首注明作者与出处 http://www.cnblogs.com/zhuxiaojie/p/6238826.html 一:本文使用范围此文不仅仅局限于spring boot,普通的spring工程,甚至是servlet工程,都是一样的,只不过配置一些监听器的方法不同而已. 本文经过作者实践,确认完美运行. 二:Spring boot使用websocket 2.1:依赖包 websocket本身是servlet容器所提供的服务,所以需要在web容器中运行,像我们所使用的tomcat,当然

ABP源码分析二：ABP中配置的注册和初始化

一般来说,ASP.NET Web应用程序的第一个执行的方法是Global.asax下定义的Start方法.执行这个方法前HttpApplication 实例必须存在,也就是说其构造函数的执行必然是完成了. ABP开始的地方就是HttpApplication的构造函数. 如下图一,Abp定义了一个继承自HttpApplication的类AbpApplication.该类的构造函数里会创建AbpBootstrapper实例,然后再Application_Start方法中调用AbpBootstrapp

ABP源码分析三：ABP Module

Abp是一种基于模块化设计的思想构建的.开发人员可以将自定义的功能以模块(module)的形式集成到ABP中.具体的功能都可以设计成一个单独的Module.Abp底层框架提供便捷的方法集成每个Module.下图是所有Abp自带的module.AbpModule是所有Module的基类,其已经拥有了IIocManager和IAbpStartupConfiguration的受保护的成员,从其派生的Module都可以直接获取并使用相关的功能(依赖注入,Configuration).: 以下以AbpWe

ABP源码分析四：Configuration

核心模块的配置 Configuration是ABP中设计比较巧妙的地方.其通过AbpStartupConfiguration,Castle的依赖注入,Dictionary对象和扩展方法很巧妙的实现了配置中心化.配置中心化是一个支持模块开发的框架必备功能. ABP中核心功能模块中的一些功能的运行时的行为是依赖于一些外部配置的.这一点应该不难理解. 简单解释下,比如Localization这个功能模块,最基本Abp需要知道要做哪些语言的本地化.而这些具体的配置对于Abp底层框架来说是不可预知的,那么

antd 源码分析 tabs

热门专题