ant-design/components/rate/demo/character-function.md
dependabot[bot] 775d1800bb
chore(deps-dev): bump eslint-config-prettier from 6.15.0 to 7.0.0 (#28253)
* chore(deps-dev): bump eslint-config-prettier from 6.15.0 to 7.0.0

Bumps [eslint-config-prettier](https://github.com/prettier/eslint-config-prettier) from 6.15.0 to 7.0.0.
- [Release notes](https://github.com/prettier/eslint-config-prettier/releases)
- [Changelog](https://github.com/prettier/eslint-config-prettier/blob/main/CHANGELOG.md)
- [Commits](https://github.com/prettier/eslint-config-prettier/compare/v6.15.0...v7.0.0)

Signed-off-by: dependabot[bot] <support@github.com>

* chore: fix eslint style

* chore: prettier code style

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: afc163 <afc163@gmail.com>
2020-12-09 17:12:32 +08:00

37 lines
708 B
Markdown

---
order: 6
title:
zh-CN: 自定义字符
en-US: Customize character
---
## zh-CN
可以使用 `(RateProps) => ReactNode` 的方式自定义每一个字符。
## en-US
Can customize each character using `(RateProps) => ReactNode`.
```jsx
import { Rate } from 'antd';
import { FrownOutlined, MehOutlined, SmileOutlined } from '@ant-design/icons';
const customIcons = {
1: <FrownOutlined />,
2: <FrownOutlined />,
3: <MehOutlined />,
4: <SmileOutlined />,
5: <SmileOutlined />,
};
ReactDOM.render(
<>
<Rate defaultValue={2} character={({ index }) => index + 1} />
<br />
<Rate defaultValue={3} character={({ index }) => customIcons[index + 1]} />
</>,
mountNode,
);
```