two-tone color setting docs

This commit is contained in:
HeskeyBaozi 2018-09-02 19:32:01 +08:00 committed by 偏右
parent d246724205
commit 4ceeab77d1
2 changed files with 14 additions and 0 deletions

View File

@ -39,6 +39,13 @@ All the icons will render to `<svg>`. You can still set `style` and `className`
<Icon type="message" style={{ fontSize: '16px', color: '#08c' }} theme="outlined" />
```
When using the two-tone icons, you can use the static methods `Icon.getTwoToneColor()` and `Icon.setTwoToneColor(colorString)` to spicify the primary color.
```jsx
Icon.setTwoToneColor('#eb2f96');
Icon.getTwoToneColor(); // #eb2f96
```
You can import svg icon as an react component by using `webpack` and [`@svgr/webpack`](https://www.npmjs.com/package/@svgr/webpack). `@svgr/webpack`'s `options` [reference](https://github.com/smooth-code/svgr#options).
```js

View File

@ -44,6 +44,13 @@ ReactDOM.render(<IconDisplay />, mountNode);
<Icon type="message" style={{ fontSize: '16px', color: '#08c' }} />
```
对于双色图标,可以通过使用 `Icon.getTwoToneColor()``Icon.setTwoToneColor(colorString)` 来设置图标主色。
```jsx
Icon.setTwoToneColor('#eb2f96');
Icon.getTwoToneColor(); // #eb2f96
```
如果使用 `webpack`,可以通过配置 [@svgr/webpack](https://www.npmjs.com/package/@svgr/webpack) 来将 `svg` 图标作为 `React` 组件导入。`@svgr/webpack` 的 `options` 选项请参阅 [svgr文档](https://github.com/smooth-code/svgr#options)。
```js