/*
 * @Title:
 * @Author: hongmye
 * @Date: 2023-02-08 16:03:42
 */
import { Button } from 'antd';
import DataCarousel from '../index';
import React from 'react';
import styles from './index.less';
function Demo() {
  const list = [
    { userId: '大邑小区', userName: '0.4Mpa' },
    { userId: '工业园一', userName: '0.4Mpa' },
    { userId: '工业园二', userName: '0.4Mpa' },
    { userId: '工业园三', userName: '0.4Mpa' },
    { userId: '工业园四', userName: '0.4Mpa' },
    { userId: '工业园五', userName: '0.4Mpa' },
    { userId: '工业园六', userName: '0.4Mpa' },
    { userId: '工业园七', userName: '0.4Mpa' },
    { userId: '工业园八', userName: '0.4Mpa' },
  ];
  const renderItem = (item) => {
    return (
      <div className={styles.list_item}>
        <span>{item.userId}</span>
        <span>{item.userName}</span>
      </div>
    );
  };
  const onSwiper = (swiper) => {
    console.log('🚀 ~ swiper', swiper);
  };
  return (
    <div style={{ width: '100%' }}>
      <div style={{ width: '300px', height: '200px', background: 'rgba(0,0,0,0.2)' }}>
        <DataCarousel list={list} renderItem={renderItem} onSwiper={onSwiper}></DataCarousel>
      </div>
      <br />
    </div>
  );
}

export default Demo;
