# @czty/clistload

> 一：说明： 滚动加载列表的组件

Latest version **0.0.14** (published 2022-08-16) · 0 weekly downloads

## Install

```sh
npm install @czty/clistload
pnpm add @czty/clistload
yarn add @czty/clistload
bun add @czty/clistload
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; low quality score; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.14 |
| Published | 2022-08-16 |
| First published | 2022-04-27 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 4 |
| Unpacked size | 22.8 KB |
| Known vulnerabilities | 0 (+23 in 1 direct dependencies) |
| Install scripts | no |
| Maintainers | fox19920726 |

## Links

- npm: https://www.npmjs.com/package/@czty/clistload
- npm.io page: https://npm.io/package/@czty/clistload

## Dependencies (4)

- [antd](https://npm.io/package/antd.md) ^4.13.0
- [axios](https://npm.io/package/axios.md) ^0.21.1
- [react](https://npm.io/package/react.md) ^17.0.0
- [react-dom](https://npm.io/package/react-dom.md) ^17.0.0

## Recent versions

- 0.0.14 (latest) — 2022-08-16
- 0.0.12 — 2022-07-28
- 0.0.11 — 2022-07-28
- 0.0.10 — 2022-07-27
- 0.0.9 — 2022-07-05
- 0.0.8 — 2022-06-20
- 0.0.7 — 2022-06-13
- 0.0.6 — 2022-06-10
- 0.0.5 — 2022-06-09
- 0.0.4 — 2022-06-07
- 0.0.3 — 2022-05-17
- 0.0.2 — 2022-05-05
- 0.0.1 — 2022-04-27

## README

一：说明：
滚动加载列表的组件

二：使用：
npm i @czty/clistload

import React from 'react';
import CListLoad from '@czty/clistload';

const MyComponent = () => {
  return (
    <CListLoad
      draggable={true}
      configer={
        x: 0,
        y: 0,
        clazz: '',
        params: { pageSize: 10, pageNum: 1 },
        url: '',
        method: 'get',

        width: '380px',
        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: '',

        fontSize: '12px',
        fontColor: '#fff',
        lineHeight: '22px',
        rowHeight: '40px',
        rowPadding: '8px 4px',
        rowBGColor: 'rgba(16, 32, 50, 1)',
        rowBGColorSele: 'linear-gradient(90deg,#193661,#102032)',
        borderColor: 'rgb(64, 155, 210)',
        rowMargin: '10px',
        showHeader: '否'
      }
    />
  )
}

三：字段说明
x: 
y:
clazz: 可添加的组件的className
params: 请求的传参参数
url: 请求的url地址
method: 请求方式
width: 组件的整体宽度
height: 组件的整体高度
title: 列标题
columnWidth: 列宽度
headerFontSize: 列表标题字号
headerFontColor: 列表标题颜色
headerHeight：列表标题行高
headerBGUrl: 列表标题背景url
headerBGColor：列表标题背景颜色
fontSize: 列表内容字号
fontColor: 列表内容颜色
rowHeight：列表行高度
lineHeight：列表内容行高
rowPadding：列表行padding
rowBGColor：列表内容背景颜色
rowBGColorSele：列表选中行背景颜色
borderColor：列表行边框颜色
rowMargin：列表内容行margin
showHeader：是否显示标题

---
_Source: https://npm.io/package/@czty/clistload · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._