# @tcly-pangu/uploader

> 文件上传组件

Latest version **1.0.8** (published 2026-10-22) · ISC license · 0 weekly downloads

## Install

```sh
npm install @tcly-pangu/uploader
pnpm add @tcly-pangu/uploader
yarn add @tcly-pangu/uploader
bun add @tcly-pangu/uploader
```

## Health

**Score 55/100 (C)** — status: active.

Positive: no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads; no types; no esm support.

## Facts

| | |
|---|---|
| Version | 1.0.8 |
| Published | 2026-10-22 |
| First published | 2023-08-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 9.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | panwenda |
| Maintainers | tcly, panwenda, di.zhao, zhihao.xiao, jing2.ji |

## Links

- npm: https://www.npmjs.com/package/@tcly-pangu/uploader
- npm.io page: https://npm.io/package/@tcly-pangu/uploader

## Recent versions

- 1.0.8 (latest) — 2026-10-22
- 1.0.7 — 2023-11-15
- 1.0.6 — 2023-09-14
- 1.0.5 — 2023-09-13
- 1.0.4 — 2023-09-12
- 1.0.3 — 2023-09-11
- 1.0.2 — 2023-08-24
- 1.0.1 — 2023-08-24
- 1.0.0 — 2023-08-16

## README

<!--
 * @Description: 文件上传组件使用说明
 * @Author: panwenda
 * @Date: 2023-08-16 11:27:38
 * @LastEditors: panwenda
 * @LastEditTime: 2023-08-16 11:38:46
-->
# 使用方式
```
npm install @tcly-pangu/uploader -S
```

```html
<uploader
  :initList="fileList"
  :size="5"
  accept=".bmp,.gif,.jpeg,.jpg,.png"
  listType="picture-card"
  tip="文件大小不超过 5M，支持 bmp、gif、jpeg、jpg、png 格式文件"
  @change="onChangeUploadImage"
></uploader>
```

```js
data () {
  return {
    fileList: [{
      uid: '1',
      name: 'test.png',
      status: 'done',
      url: 'https://test.png'
    }], // 文件列表
    form: {
      imageUrl: '' // 图片地址
    }
  }
},
methods: {
  /**
   * 监听改变上传图片
   * @param {Array} fileList - 文件列表
   */
  onChangeUploadImage (fileList) {
    this.form.imageUrl = fileList.length ? fileList[0].url : ''
  }
}
```

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