antd源码
点了个汤
菜鸡前端一枚
展开
-
antd源码-form解析(初始化到表单收集校验过程)
antd源码-form解析(初始化到表单收集校验过程)form是我们日常使用最多的控件,form是怎么收集表单信息的?是怎么回填数据的,怎么对表单校验的呢?它背后的逻辑和思路是怎样的。研究源码一是可以帮助我们将我们日常工作所使用的控件有一个完整的闭环的理解,二是帮助我们学习到优秀团队对问题的解决思路和方法。Form.create做了什么?createDOMForm深入源码form.crea...原创 2020-04-30 19:13:33 · 2817 阅读 · 0 评论 -
antd源码-locale国际化解析
antd源码-locale国际化解析antd的国际化是利用react的context来完成的。组件内部我找了一个需要国际化的组件,popconfirm源码 renderConfirm = ({ getPrefixCls }: ConfigConsumerProps) => { const { prefixCls: customizePrefixCls, placement,...原创 2020-04-22 18:26:14 · 3274 阅读 · 0 评论 -
antd源码-spin解析
antd源码-spin解析spin的作用是代表当前块正在加载中Spin元素的渲染 renderSpin = ({ getPrefixCls }: ConfigConsumerProps) => { const { prefixCls: customizePrefixCls, className, size, tip, ...原创 2020-04-21 20:05:50 · 4078 阅读 · 0 评论 -
antd源码-anchor解析
antd源码-anchor解析整个anchor可以分为几部分:context的运用滚动事件监听组件didupdate的更新context运用anchorstatic childContextTypes = { antAnchor: PropTypes.object, }; getChildContext() { const antAnchor: Ant...原创 2020-04-08 21:34:43 · 2826 阅读 · 0 评论 -
antd源码-Affix固钉解析
antd源码-Affix固钉解析固钉其实按照我自己的理解就是用固定定位将其定位到某个位置。很简单的一个效果。antd-affix我认为其核心可以概括为几点:组件加载滚动监听,组件销毁销毁监听。利用一个元素在原本元素位置占位。当达到固定元素的条件。元素占位,反之。相反。监听占位元素、宽度高度样式的更改,有更改就去重置渲染参数条件。render函数 render() {...原创 2020-04-03 18:31:39 · 2714 阅读 · 0 评论 -
antd源码-alert解析
antd源码-alertalert的源码不难理解,主要分为几个部分:计算alert组件的类名 const alertCls = classNames( prefixCls,// ant-alert `${prefixCls}-${type}`, // 样式类型 { [`${prefixCls}-closing`]: closing, // ...原创 2020-04-01 19:46:55 · 1273 阅读 · 0 评论 -
antd源码-button解析
antd源码-Button解析Button render在Button的组件中的index函数中,我们从antd引入button的时候是从index.tsx这个文件引入的import Button from './button';import ButtonGroup from './button-group';export { ButtonProps, ButtonShape, But...原创 2020-03-29 10:56:17 · 2909 阅读 · 0 评论