mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 20:49:53 +08:00
docs: add instruction for component token (#42838)
This commit is contained in:
parent
a0d8fcb23a
commit
2710923800
@ -7,6 +7,35 @@ This document contains the correspondence between all the less variables related
|
||||
|
||||
<Alert message="Note: There are still some less variables that do not have a corresponding Component Token, and these variables have been deprecated in version 5.x."></Alert>
|
||||
|
||||
## How to use Component Token
|
||||
|
||||
We could configure global token and component token for each component through the `theme` property of ConfigProvider.
|
||||
|
||||
```tsx
|
||||
import { Checkbox, ConfigProvider, Radio } from 'antd';
|
||||
import React from 'react';
|
||||
|
||||
const App: React.FC = () => (
|
||||
<ConfigProvider
|
||||
theme={{
|
||||
components: {
|
||||
Radio: {
|
||||
colorPrimary: '#00b96b',
|
||||
},
|
||||
Checkbox: {
|
||||
colorPrimary: '#ff4d4f',
|
||||
},
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Radio>Radio</Radio>
|
||||
<Checkbox>Checkbox</Checkbox>
|
||||
</ConfigProvider>
|
||||
);
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
<!-- ## 全局变量 -->
|
||||
|
||||
## Component Token
|
||||
|
@ -7,6 +7,35 @@ title: Less 变量迁移 Design Token
|
||||
|
||||
<Alert message="注意:仍有部分变量没有对应的 Component Token,这些变量在 5.x 版本中已被废弃。"></Alert>
|
||||
|
||||
## 如何配置 Component Token
|
||||
|
||||
通过 ConfigProvider 的 `theme` 属性,我们可以对每一个组件单独配置全局 Token 和组件 Token
|
||||
|
||||
```tsx
|
||||
import { Checkbox, ConfigProvider, Radio } from 'antd';
|
||||
import React from 'react';
|
||||
|
||||
const App: React.FC = () => (
|
||||
<ConfigProvider
|
||||
theme={{
|
||||
components: {
|
||||
Radio: {
|
||||
colorPrimary: '#00b96b',
|
||||
},
|
||||
Checkbox: {
|
||||
colorPrimary: '#ff4d4f',
|
||||
},
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Radio>Radio</Radio>
|
||||
<Checkbox>Checkbox</Checkbox>
|
||||
</ConfigProvider>
|
||||
);
|
||||
|
||||
export default App;
|
||||
```
|
||||
|
||||
<!-- ## 全局变量 -->
|
||||
|
||||
## 组件变量
|
||||
|
Loading…
Reference in New Issue
Block a user