mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-24 02:59:58 +08:00
docs: update blog ref to zhuanlan (#49960)
This commit is contained in:
lijianan
GitHub
parent
ef6767d6f2
commit
4a84f7e335
@ -2,6 +2,7 @@ import React from 'react';
|
||||
import { RightOutlined, YuqueOutlined, ZhihuOutlined } from '@ant-design/icons';
|
||||
import { Button, Card, Divider } from 'antd';
|
||||
import { createStyles } from 'antd-style';
|
||||
import classNames from 'classnames';
|
||||
|
||||
import useLocale from '../../../hooks/useLocale';
|
||||
import JuejinLogo from './JuejinLogo';
|
||||
@ -42,6 +43,7 @@ const useStyle = createStyles(({ token, css }) => ({
|
||||
color: #444;
|
||||
font-size: ${token.fontSizeLG}px;
|
||||
font-weight: ${token.fontWeightStrong};
|
||||
user-select: none;
|
||||
`,
|
||||
subTitle: css`
|
||||
display: flex;
|
||||
@ -54,37 +56,34 @@ const useStyle = createStyles(({ token, css }) => ({
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
.logo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
font-size: 24px;
|
||||
&.zhihu-logo {
|
||||
color: #056de8;
|
||||
}
|
||||
&.yuque-logo {
|
||||
color: #00b96b;
|
||||
}
|
||||
&.juejin-logo {
|
||||
color: #1e80ff;
|
||||
}
|
||||
`,
|
||||
logo: css`
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
font-size: 24px;
|
||||
&.zhihu-logo {
|
||||
color: #056de8;
|
||||
}
|
||||
.arrowIcon {
|
||||
color: #8a8f8d;
|
||||
margin: 0 ${token.marginXS}px;
|
||||
font-size: ${token.fontSizeSM}px;
|
||||
&.yuque-logo {
|
||||
color: #00b96b;
|
||||
}
|
||||
.zl-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
color: #646464;
|
||||
&.juejin-logo {
|
||||
color: #1e80ff;
|
||||
}
|
||||
`,
|
||||
btn: css`
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
arrowIcon: css`
|
||||
color: #8a8f8d;
|
||||
margin: 0 ${token.marginXS}px;
|
||||
font-size: ${token.fontSizeSM}px;
|
||||
`,
|
||||
zlBtn: css`
|
||||
padding: 0;
|
||||
color: #646464;
|
||||
`,
|
||||
discussLogo: css`
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
font-size: 16px;
|
||||
`,
|
||||
}));
|
||||
|
||||
@ -114,7 +113,18 @@ interface Props {
|
||||
const ColumnCard: React.FC<Props> = ({ zhihuLink, yuqueLink, juejinLink }) => {
|
||||
const [locale] = useLocale(locales);
|
||||
const {
|
||||
styles: { card, bigTitle, cardBody, left, title, subTitle, btn },
|
||||
styles: {
|
||||
card,
|
||||
bigTitle,
|
||||
cardBody,
|
||||
left,
|
||||
title,
|
||||
subTitle,
|
||||
logo,
|
||||
arrowIcon,
|
||||
zlBtn,
|
||||
discussLogo,
|
||||
},
|
||||
} = useStyle();
|
||||
if (!zhihuLink && !yuqueLink && !juejinLink) {
|
||||
return null;
|
||||
@ -123,52 +133,54 @@ const ColumnCard: React.FC<Props> = ({ zhihuLink, yuqueLink, juejinLink }) => {
|
||||
<Card className={card} bordered={false}>
|
||||
<h3 className={bigTitle}>{locale.bigTitle}</h3>
|
||||
{zhihuLink && (
|
||||
<div className={cardBody}>
|
||||
<div className={left}>
|
||||
<img src={ANTD_IMG_URL} alt="antd" />
|
||||
<div>
|
||||
<p className={title}>Ant Design</p>
|
||||
<div className={subTitle}>
|
||||
<ZhihuOutlined className="logo zhihu-logo" />
|
||||
<RightOutlined className="arrowIcon" />
|
||||
<Button
|
||||
target="_blank"
|
||||
href="https://www.zhihu.com/column/c_1564262000561106944"
|
||||
className="zl-btn"
|
||||
type="link"
|
||||
>
|
||||
{locale.zhiHu}
|
||||
</Button>
|
||||
<>
|
||||
<Divider />
|
||||
<div className={cardBody}>
|
||||
<div className={left}>
|
||||
<img draggable={false} src={ANTD_IMG_URL} alt="antd" />
|
||||
<div>
|
||||
<p className={title}>Ant Design</p>
|
||||
<div className={subTitle}>
|
||||
<ZhihuOutlined className={classNames(logo, 'zhihu-logo')} />
|
||||
<RightOutlined className={arrowIcon} />
|
||||
<Button
|
||||
target="_blank"
|
||||
href="https://www.zhihu.com/column/c_1564262000561106944"
|
||||
className={zlBtn}
|
||||
type="link"
|
||||
>
|
||||
{locale.zhiHu}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Button
|
||||
ghost
|
||||
type="primary"
|
||||
icon={<ZhihuOutlined className={discussLogo} />}
|
||||
target="_blank"
|
||||
href={zhihuLink}
|
||||
>
|
||||
{locale.buttonText}
|
||||
</Button>
|
||||
</div>
|
||||
<Button
|
||||
type="primary"
|
||||
className={btn}
|
||||
icon={<ZhihuOutlined style={{ fontSize: 16 }} />}
|
||||
ghost
|
||||
target="_blank"
|
||||
href={zhihuLink}
|
||||
>
|
||||
{locale.buttonText}
|
||||
</Button>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
{yuqueLink && (
|
||||
<>
|
||||
<Divider />
|
||||
<div className={cardBody}>
|
||||
<div className={left}>
|
||||
<img src={ANTD_IMG_URL} alt="antd" />
|
||||
<img draggable={false} src={ANTD_IMG_URL} alt="antd" />
|
||||
<div>
|
||||
<p className={title}>Ant Design</p>
|
||||
<div className={subTitle}>
|
||||
<YuqueOutlined className="logo yuque-logo" />
|
||||
<RightOutlined className="arrowIcon" />
|
||||
<YuqueOutlined className={classNames(logo, 'yuque-logo')} />
|
||||
<RightOutlined className={arrowIcon} />
|
||||
<Button
|
||||
target="_blank"
|
||||
href="https://www.yuque.com/ant-design/ant-design"
|
||||
className="zl-btn"
|
||||
className={zlBtn}
|
||||
type="link"
|
||||
>
|
||||
{locale.yuQue}
|
||||
@ -177,10 +189,9 @@ const ColumnCard: React.FC<Props> = ({ zhihuLink, yuqueLink, juejinLink }) => {
|
||||
</div>
|
||||
</div>
|
||||
<Button
|
||||
type="primary"
|
||||
className={btn}
|
||||
icon={<YuqueOutlined style={{ fontSize: 16 }} />}
|
||||
ghost
|
||||
type="primary"
|
||||
icon={<YuqueOutlined className={discussLogo} />}
|
||||
target="_blank"
|
||||
href={yuqueLink}
|
||||
>
|
||||
@ -194,16 +205,16 @@ const ColumnCard: React.FC<Props> = ({ zhihuLink, yuqueLink, juejinLink }) => {
|
||||
<Divider />
|
||||
<div className={cardBody}>
|
||||
<div className={left}>
|
||||
<img src={ANTD_IMG_URL} alt="antd" />
|
||||
<img draggable={false} src={ANTD_IMG_URL} alt="antd" />
|
||||
<div>
|
||||
<p className={title}>Ant Design</p>
|
||||
<div className={subTitle}>
|
||||
<JuejinLogo className="logo juejin-logo" />
|
||||
<RightOutlined className="arrowIcon" />
|
||||
<JuejinLogo className={classNames(logo, 'juejin-logo')} />
|
||||
<RightOutlined className={arrowIcon} />
|
||||
<Button
|
||||
target="_blank"
|
||||
href="https://juejin.cn/column/7247354308258054200"
|
||||
className="zl-btn"
|
||||
className={zlBtn}
|
||||
type="link"
|
||||
>
|
||||
{locale.junjin}
|
||||
@ -212,10 +223,9 @@ const ColumnCard: React.FC<Props> = ({ zhihuLink, yuqueLink, juejinLink }) => {
|
||||
</div>
|
||||
</div>
|
||||
<Button
|
||||
type="primary"
|
||||
className={btn}
|
||||
icon={<JuejinLogo style={{ fontSize: 16, width: 16, height: 16 }} />}
|
||||
ghost
|
||||
type="primary"
|
||||
icon={<JuejinLogo className={discussLogo} />}
|
||||
target="_blank"
|
||||
href={juejinLink}
|
||||
>
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: A build ghost
|
||||
date: 2023-12-20
|
||||
author: zombieJ
|
||||
juejin_url: https://juejin.cn/post/7322352551088341019
|
||||
---
|
||||
|
||||
In the maintenance of antd-mobile, We meet an annoying ghost. It rarely appears when building locally, but it almost always appears in the github workflow. After a lot of tossing, We finally found its trace.
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: 一个构建的幽灵
|
||||
date: 2023-12-20
|
||||
author: zombieJ
|
||||
juejin_url: https://juejin.cn/post/7322352551088341019
|
||||
---
|
||||
|
||||
在 antd-mobile 的维护过程中，遇到了一个恼人的幽灵。它在本地构建时几乎不会出现，但是在 github 的 workflow 中，却几乎每次都会出现。在经过一番折腾后，终于找到了它的踪迹。
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
title: Tree's check conduction
|
||||
date: 2022-12-14
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/608106800
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/hiufwnq7iqoded0h
|
||||
---
|
||||
|
||||
In the Tree or similar components (such as TreeSelect, Cascader), needs check function. It's unambiguous most of the time, but when a `disabled` node appears somewhere in the middle, it's worth talking about. This article will introduce the logic of check conduction in antd. It should be noted that in different scenarios, there will be various requirements, and antd has chosen the most commonly used check conduction logic. If you need a different custom style, you can implement it yourself through `checkStrictly`.
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
title: Tree 的勾选传导
|
||||
date: 2022-12-14
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/608106800
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/hiufwnq7iqoded0h
|
||||
---
|
||||
|
||||
在 Tree 组件以及类似的组件（如 TreeSelect、Cascader），都会需要勾选功能。在大部分情况下它都没有歧义，但是当中间的某个节点出现 `disabled` 节点时，这就值得讨论了。这篇文章会介绍 antd 中，勾选传导的逻辑。需要注意的是，在不同的场景下，会有各种不同的需求，antd 选择了其中最常用的一种勾选传导逻辑。如果你需要不同的定制款，可以通过 `checkStrictly` 来自行实现。
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: Color Models and Color Picker
|
||||
date: 2023-09-07
|
||||
author: Redjue
|
||||
juejin_url: https://juejin.cn/post/7322296529783226405
|
||||
---
|
||||
|
||||
Hello everyone, I'm [Redjue](https://github.com/Redjue), and I'm honored to have the opportunity to contribute the [ColorPicker](/components/color-picker) component to **Ant Design** this year. It's been a great learning experience and has given me a deeper understanding of the development process of **Ant Design**. In this article, I will share the specific implementation process.
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: 色彩模型与颜色选择器
|
||||
date: 2023-09-07
|
||||
author: Redjue
|
||||
juejin_url: https://juejin.cn/post/7322296529783226405
|
||||
---
|
||||
|
||||
大家好，我是 [Redjue（红果汁）](https://github.com/Redjue)，很荣幸今年有机会向 **Ant Design** 贡献了颜色选择器组件 [ColorPicker](/components/color-picker-cn)，这是一次很棒的学习机会，也让我对 **Ant Design** 的开发流程有了更深入的了解。在这篇文章中，我将分享一下具体的实现过程。
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: Extends Theme
|
||||
date: 2023-09-03
|
||||
author: zombieJ
|
||||
juejin_url: https://juejin.cn/post/7322313142922100746
|
||||
---
|
||||
|
||||
Ant Design v5 provides the Design Token model, which supports custom algorithm to implement theme extension capabilities. For example, the compact theme itself does not carry color style algorithms, so it can be implemented by passing in multiple algorithms to achieve the compact theme under the light theme and the compact theme under the dark theme.
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: 主题拓展
|
||||
date: 2023-09-03
|
||||
author: zombieJ
|
||||
juejin_url: https://juejin.cn/post/7322313142922100746
|
||||
---
|
||||
|
||||
Ant Design v5 提供了 Design Token 模型，支持自定义算法实现主题拓展能力。例如 紧凑主题 本身并不携带颜色样式算法，所以可以通过传入多个算法的方式实现 亮色主题下的紧凑主题 以及 暗色主题下的紧凑主题。
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Contributor development maintenance guide
|
||||
date: 2023-03-10
|
||||
author: kiner-tang
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266384
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/rixou58ogv8hlev2
|
||||
juejin_url: https://juejin.cn/post/7322305961196273673
|
||||
---
|
||||
|
||||
Hi, I'm [kiner-tang](https://github.com/kiner-tang) who is a heavy user of Ant Design. As the same reason, I come up to be a contributor for fixing bug and some features. Finally, it's my honer to become a member of Ant Design Collaborator.
|
||||
|
||||
@ -2,9 +2,12 @@
|
||||
title: 贡献者开发维护指南
|
||||
date: 2023-03-10
|
||||
author: kiner-tang
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266384
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/rixou58ogv8hlev2
|
||||
juejin_url: https://juejin.cn/post/7322305961196273673
|
||||
---
|
||||
|
||||
大家好，我是[kiner-tang(文辉)](https://github.com/kiner-tang)，我个人的工作内容可以说与 Ant Design 密切相关，可以算是 Ant Design 的重度用户了。也正因如此，让我由一个使用者慢慢地向着贡献者 Contributor 迈进，将自己在工作过程中遇到的一些问题和总结出的新特性回馈于社区，并最终很荣幸地成为了 Ant Design 的 Collaborator 中的一员。在从使用者到贡献者，再从贡献者到合作者的旅途中，也遇到了不少的问题，借此机会梳理总结一下，希望能对新加入 Ant Design 社区的贡献者和合作者们有所帮助。
|
||||
大家好，我是 [kiner-tang(文辉)](https://github.com/kiner-tang)，我个人的工作内容可以说与 Ant Design 密切相关，可以算是 Ant Design 的重度用户了。也正因如此，让我由一个使用者慢慢地向着贡献者 Contributor 迈进，将自己在工作过程中遇到的一些问题和总结出的新特性回馈于社区，并最终很荣幸地成为了 Ant Design 的 Collaborator 中的一员。在从使用者到贡献者，再从贡献者到合作者的旅途中，也遇到了不少的问题，借此机会梳理总结一下，希望能对新加入 Ant Design 社区的贡献者和合作者们有所帮助。
|
||||
|
||||
## 普通常见问题
|
||||
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Component-level CSS-in-JS
|
||||
date: 2022-11-25
|
||||
author: MadCcc
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/606291980
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/iv21twb9368r0goc
|
||||
juejin_url: https://juejin.cn/post/7322352551088635931
|
||||
---
|
||||
|
||||
On November 18, 2022, we released Ant Design 5.0. At the same time, Ant Design's unique CSS-in-JS solution was brought into everyone's view. Through this solution, Ant Design achieves higher performance than other CSS-in-JS libraries, but at the cost of sacrificing its flexibility for free use in applications. So we call it a "component-level" CSS-in-JS solution. <a name="W668Z"></a>
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: 组件级别的 CSS-in-JS
|
||||
date: 2022-11-25
|
||||
author: MadCcc
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/606291980
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/iv21twb9368r0goc
|
||||
juejin_url: https://juejin.cn/post/7322352551088635931
|
||||
---
|
||||
|
||||
在 2022 年 11 月 18 日，我们发布了 Ant Design 5.0 的正式版本，同时带入大家视野中的还有 Ant Design 独特的 CSS-in-JS 方案。通过这个方案，Ant Design 获得了相较于其他 CSS-in-JS 库更高的性能，但代价则是牺牲了其在应用中自由使用的灵活性。所以我们把它称为“组件级”的 CSS-in-JS 方案。
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: SSR Static style export
|
||||
date: 2023-04-25
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266657
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/gyacdbtixle9bbm4
|
||||
juejin_url: https://juejin.cn/post/7322352551088603163
|
||||
---
|
||||
|
||||
For traditional js + css websites, SSR only needs to deal with the hydrate problem of the first rendering. With the introduction of CSS-in-JS technology, developers need to pay additional attention to how to export styles to HTML to ensure the correctness of the view. We provide a lot of implementation methods, and we just talk about the ideas here. If you need complete documentation or examples, please refer to [Customize Theme](/docs/react/customize-theme-cn).
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: SSR 静态样式导出
|
||||
date: 2023-04-25
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266657
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/gyacdbtixle9bbm4
|
||||
juejin_url: https://juejin.cn/post/7322352551088603163
|
||||
---
|
||||
|
||||
传统的 js + css 网站，SSR 一般只需要处理好首次渲染的注水问题。而当 CSS-in-JS 技术的引入，开发者则需要额外关注如何将样式导出到 HTML 中，以保证首次渲染的正确性。我们提供了非常多的实现方式，也正好在此聊聊其中的思路。如果你需要完整的文档或者示例欢迎查阅[《定制主题》](/docs/react/customize-theme-cn)。
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
title: Some change on getContainer
|
||||
date: 2022-12-08
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/606878571
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/eegn0tn5fy94uwk8
|
||||
---
|
||||
|
||||
We often encounter the need for pop-up elements when developing, such as the Select drop-down box, or the Modal component. When it is directly rendered under the current node, it may be clipped by the `overflow: hidden` of the parent node:
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
title: getContainer 的一些变化
|
||||
date: 2022-12-08
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/606878571
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/eegn0tn5fy94uwk8
|
||||
---
|
||||
|
||||
在网页开发中，我们时常会遇到弹出元素的需求，比如 Select 的下拉框、或者是 Modal 组件。直接将其渲染到当前节点下时，可能会被父节点的 `overflow: hidden` 裁剪掉：
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: Hi, GitHub Actions
|
||||
date: 2023-06-06
|
||||
author: Wxh16144
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266855
|
||||
---
|
||||
|
||||
Hi, I'm [Wxh16144](https://github.com/Wxh16144). I have discovered some tools that can improve development efficiency and code quality through learning Ant Design's component library and participating in community contributions. I'd like to take this opportunity to share my experience with you. To help better understand Ant Design, and to apply these techniques to your own projects.
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: 你好，GitHub Actions
|
||||
date: 2023-06-06
|
||||
author: Wxh16144
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266855
|
||||
---
|
||||
|
||||
大家好，我是 [Wxh16144](https://github.com/Wxh16144)，通过学习 Ant Design 的组件库和参与社区贡献，我发现了一些提高开发效率和代码质量的工具。借此机会，希望与大家分享我的经验，帮助大家更好地了解 Ant Design，并将这些技巧应用到自己的项目中。
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Dependency troubleshooting
|
||||
date: 2023-04-13
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266509
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/yi1lz5dg3iygwbed
|
||||
juejin_url: https://juejin.cn/post/7322296529783128101
|
||||
---
|
||||
|
||||
As a large component library, Ant Design has complex internal dependencies. Sometimes there is nothing change in antd, but the update of the internal dependencies may also cause the developer's build failure. For example, my recent mistake with [path case error](https://github.com/ant-design/ant-design/issues/41236) made the build fail under Linux.
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: 依赖排查
|
||||
date: 2023-04-13
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266509
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/yi1lz5dg3iygwbed
|
||||
juejin_url: https://juejin.cn/post/7322296529783128101
|
||||
---
|
||||
|
||||
Ant Design 作为大型组件库，内部依赖十分复杂。有时候 antd 代码本身没有改动，但是底层依赖更新也可能导致开发者的构建失败。比如最近由于我的失误，一处[路径大小写错误](https://github.com/ant-design/ant-design/issues/41236)使得在 Linux 下会构建失败。
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Funny Modal hook BUG
|
||||
date: 2022-12-21
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639265725
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/yq0w59gikugthyqz
|
||||
juejin_url: https://juejin.cn/post/7322306608103686194
|
||||
---
|
||||
|
||||
Recently we encountered an [issue](https://github.com/ant-design/ant-design/issues/39427), saying that when `contextHolder` of `Modal.useModal` is placed in different positions, `modal.confirm` popup location will be different:
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Modal hook 的有趣 BUG
|
||||
date: 2022-12-21
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639265725
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/yq0w59gikugthyqz
|
||||
juejin_url: https://juejin.cn/post/7322306608103686194
|
||||
---
|
||||
|
||||
最近我们遇到了一个 [issue](https://github.com/ant-design/ant-design/issues/39427)，说是 `Modal.useModal` 的 `contextHolder` 在放置不同的位置时，`modal.confirm` 弹出位置会不一样：
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Unnecessary Rerender
|
||||
date: 2022-12-31
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/633328911
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/uz7b7d6wq05e4wvo
|
||||
juejin_url: https://juejin.cn/post/7322352551088537627
|
||||
---
|
||||
|
||||
For heavy components, some bug fixes or new features can easily destroy the original performance optimization inadvertently over time. Recently, we are refactoring the Table to troubleshoot and restore the performance loss caused by some historical updates. Here, we introduce some common troubleshooting method and frequently meet problems.
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: 非必要的渲染
|
||||
date: 2022-12-31
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/633328911
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/uz7b7d6wq05e4wvo
|
||||
juejin_url: https://juejin.cn/post/7322352551088537627
|
||||
---
|
||||
|
||||
对于重型组件而言，随着时间推移，一些 BUG Fix 或者新增 Feature 很容易不经意间将原本的性能优化给破坏掉。而最近，我们在对 Table 进行重构将一些历史更新导致的性能损失进行排查并恢复。在此，我们介绍一些常用的排查技巧以及常见问题。
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: about antd test library migration
|
||||
date: 2022-12-20
|
||||
author: li-jia-nan,zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639249930
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/bunxvp7nz4y7bbhi
|
||||
juejin_url: https://juejin.cn/post/7179115861176188983
|
||||
---
|
||||
|
||||
Hello, I am **[@li-jia-nan](https://github.com/li-jia-nan)**. It is also a new Collaborator who joined antd in the past few months. Fortunately, as one of the Collaborators, I developed the **[FloatButton component](/components/float-button)** and **[QRCode component](/components/qrcode)**, as well as some other maintenance work. Let me share the migration of the antd test library son~
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: antd 测试库迁移的那些事儿
|
||||
date: 2022-12-20
|
||||
author: li-jia-nan,zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639249930
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/bunxvp7nz4y7bbhi
|
||||
juejin_url: https://juejin.cn/post/7179115861176188983
|
||||
---
|
||||
|
||||
大家好，我是 **[@li-jia-nan](https://github.com/li-jia-nan)**。也是前几个月新加入 antd 的 Collaborator，有幸作为 Collaborators 之一，我开发了 **[FloatButton](/components/float-button-cn)** 组件和 **[QRCode](/components/qrcode-cn)** 组件，以及一些其它维护工作，下面分享一下 antd 测试库迁移的那些事儿～
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
title: How to Grow as a Collaborator
|
||||
date: 2022-12-22
|
||||
author: heiyu4585
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639265896
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/as5hro5edxcslweh
|
||||
---
|
||||
|
||||
Hello everyone, I am [heiyu](https://github.com/heiyu4585). About Ant Design, I believe everyone is very familiar with it. Before I contributed to Ant Design, I have used Ant Design in many background management system projects at work. The biggest feeling for me is that it is easy to use, beautiful, simple and stable. Now that the v5 version has been released, I strongly recommend everyone to try it. I am also fortunate to have developed the v5 version of the `Tour` component and `App` component, as well as some other maintenance work. Let me share with you the PR process of Ant Design, hoping to provide a reference for who are interested in building together for the community.
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
title: 如何成长为 Collaborator
|
||||
date: 2022-12-22
|
||||
author: heiyu4585
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639265896
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/as5hro5edxcslweh
|
||||
---
|
||||
|
||||
大家好，我是[黑雨](https://github.com/heiyu4585)。关于 Ant Design，相信大家都非常熟悉，我在很多后台管理系统项目使用过 Ant Design，给我最大的感觉就是好用、好看、简单、稳定。现在 `v5` 版本已经发布，强烈推荐大家试使用，我也有幸开发了 `v5` 版本的 `Tour` 组件和 `App` 组件，以及一些其他维护工作。下面给大家分享一下 Ant Design 的 PR 流程，希望能给有兴趣为社区共建的同学提供一份参考。
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: To be what you see
|
||||
date: 2023-05-10
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266810
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/vhife82m442inpws
|
||||
juejin_url: https://juejin.cn/post/7322296529783078949
|
||||
---
|
||||
|
||||
With daily development, have you thought about a problem. When the range limit is different from the actual value, how should we deal with it? Suppose we have a display component that simply displays your value:
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: 所见即所得
|
||||
date: 2023-05-10
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/639266810
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/vhife82m442inpws
|
||||
juejin_url: https://juejin.cn/post/7322296529783078949
|
||||
---
|
||||
|
||||
在日常开发过程中，你是否思考过一个问题。那就是范围限定和实际值不同的时候，应该如何去处理？假设我们有一个展示组件，它很简单的将你的值进行展示：
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: Tooltip align update
|
||||
date: 2023-02-15
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/633332552
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/lqtquocyv0k3xbg0
|
||||
juejin_url: https://juejin.cn/post/7322352551088390171
|
||||
---
|
||||
|
||||
In the `5.3.0` version, we will update the underlying dependency `@rc-component/trigger` of the Tooltip component to better implement adaptive alignment logic. Before that, let's talk about some problems encountered in the previous version.
|
||||
|
||||
@ -2,6 +2,9 @@
|
||||
title: 新的 Tooltip 对齐方式
|
||||
date: 2023-02-15
|
||||
author: zombieJ
|
||||
zhihu_url: https://zhuanlan.zhihu.com/p/633332552
|
||||
yuque_url: https://www.yuque.com/ant-design/ant-design/lqtquocyv0k3xbg0
|
||||
juejin_url: https://juejin.cn/post/7322352551088390171
|
||||
---
|
||||
|
||||
在 `5.3.0` 版本中，我们将会更新 Tooltip 组件的底层依赖 `@rc-component/trigger` 使其更好的实现自适应对齐逻辑。在此之前，我们先聊聊此前版本遇到的一些问题。
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: Virtual Table is here!
|
||||
date: 2023-08-29
|
||||
author: zombieJ
|
||||
juejin_url: https://juejin.cn/post/7322305961196126217
|
||||
---
|
||||
|
||||
## Preface
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
title: 虚拟表格来了！
|
||||
date: 2023-08-29
|
||||
author: zombieJ
|
||||
juejin_url: https://juejin.cn/post/7322305961196126217
|
||||
---
|
||||
|
||||
## 前言
|
||||
|
||||
Loading…
Reference in New Issue
Block a user