横向列表

@aligov/components-hoz-list

横向列表，如用于概览数据展示

API

参数名 说明 必填 类型 默认值 备注
dataSource 数据源 Array
valueFormatter 值格式化方式 string, function

dataSource 是一个数组数据源，数组项的格式是 { label: any, value: any }。

valueFormatter 是值的格式化方式，默认是不做格式化。格式化的方式包括：千分位分隔（thousandSeparator）、百分比展示（percent）、日期时间（timestamp2Date）。

DEMO 列表

默认用法

238,349
订单总数
174,262
厅局下单数
64,087
个人下单数
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import HozList from '@aligov/components-hoz-list';

const dataSource = [
    { label: '订单总数', value: 238349 },
    { label: '厅局下单数', value: 174262 },
    { label: '个人下单数', value: 64087 },
];

class App extends Component {
  render() {
    return <HozList dataSource={dataSource} valueFormatter="thousandSeparator" />;
  }
}

ReactDOM.render((
  <App />
), mountNode);