import { BfExpandableList } from '@bud-fe/react-taro-ui';
import { View } from '@tarojs/components';
import React from 'react';
import styles from './index.module.less';

interface IItem {
  name: string;
  age: number;
}

export default () => {
  return (
    <>
      <BfExpandableList<IItem>
        className={styles['list-container']}
        data={[
          { name: '热苏斯', age: 25 },
          { name: '萨卡', age: 21 },
          { name: '马丁内利', age: 21 },
          { name: '厄德高', age: 25 },
          { name: '史密斯罗', age: 21 },
          { name: '托马斯', age: 25 },
        ]}
        maxCount={3}
        itemRender={(item, index) => (
          <View className={styles['list-item']}>
            {index}: {JSON.stringify(item)}
          </View>
        )}
      />

      <BfExpandableList<IItem>
        className={styles['list-container']}
        data={[
          { name: '热苏斯', age: 25 },
          { name: '萨卡', age: 21 },
          { name: '马丁内利', age: 21 },
          { name: '厄德高', age: 25 },
          { name: '史密斯罗', age: 21 },
          { name: '托马斯', age: 25 },
        ]}
        maxCount={2}
        itemRender={(item, index) => (
          <View className={styles['list-item']}>
            {index}: {JSON.stringify(item)}
          </View>
        )}
      />
    </>
  );
};