一：说明： 列表组件的封装

二：使用： npm i @czty/clist

import React from 'react'; import CList from '@czty/clist';

const MyComponent = () => { return ( <CList draggable={true} configer={ x: 0, y: 0, clazz: '', params: {}, url: '', method: 'get', data: [ ['2021-02-01 9:00:00', '测试内容', '100', '普通类型'], ['2021-02-01 9:00:00', '测试内容', '100', '特殊类型'] ],

  width: '400px',
  height: '200px',
  title: [
    { createTime: '时间', show: true },
    { content: '内容', show: true },
    { score: '分数', show: false },
    { type: '类型', show: true }
  ],
  columnWidth: [ '34%', '40%', '26%' ],
  headerFontSize: '14px',
  headerFontColor: 'rgb(137, 171, 205)',
  headerHeight: '40px',
  headerBGUrl: './images/sft/listbg1.png',
  headerBGColor: '',

  bodyFontSize: '14px',
  bodyFontColor: '#888',
  bodyRowHeight: '40px',
  rowBGColor: 'rgba(0, 0, 0, 0.3)/none',
  isScroll: '是',
  showHeader: '是'
}
/>

) }

三：字段说明 x: y: clazz: 可添加的组件的className params: 请求的传参参数 url: 请求的url地址 method: 请求方式 width: 组件的整体宽度 height: 组件的整体高度 data: 列表数据 title: 列标题 columnWidth: 列宽度 headerFontSize: 列表标题字号 headerFontColor: 列表标题颜色 headerHeight：列表标题行高 headerBGUrl: 列表标题背景url headerBGColor：列表标题背景颜色 bodyFontSize: 列表内容字号 bodyFontColor: 列表内容颜色 bodyRowHeight：列表内容行高 rowBGColor：列表内容背景颜色 isScroll：是否滚动 showHeader：是否显示标题