# CNumerical 数值显示
## 功能说明
用于以美观的方式展示一组数值及其标题的组件,支持小数点分隔显示,可以自适应不同数量的数值项,并支持点击事件。
## 引用方式
```js
import CNumerical from '@components/layout/numerical';
```
## 组件参数
- `values` (Array,必选):数值集合,数组中的每项为对象,包含以下属性:
- `title` (String):数值项的标题
- `value` (Number|String):要显示的数值
- `textType` (String,可选):文本颜色类型,对应 CSS 类 'm-text-{textType}'
- `onClick` (Function,可选):点击数值项时的回调函数,接收当前项对象作为参数
## 使用示例
### 基础用法
```html
```
### 带颜色样式和点击事件
```html
```
## 注意事项
1. 组件会根据传入的数值项数量自动调整布局:
- 当数量能被3整除时,每行显示3个项目
- 当数量除以3余1时,最后4个项目每行显示2个
- 当数量除以3余2时,最后2个项目独占一行
- 当只有1个项目时,占满整行
2. 数值会自动分离整数和小数部分,整数部分字体较大,小数部分字体较小
3. 当整数部分超过4位数时,小数部分的字体会进一步缩小
4. 具有onClick属性的项目会显示一个向右的箭头,并增加点击样式
5. textType属性可以控制数值的颜色,通过添加类名 'm-text-{textType}' 实现