npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@beisen-phoenix/field-upload

v3.3.55

Published

| name | description | type | default | | ---------- | ---------------------------------------- | -------- | ------- | | multiple | 是否允许多张上传 | boolean | true | | maxSize | 文件的最大体积,单位为M | number | 99999 | | maxFil

Downloads

411

Readme

| name | description | type | default | | ---------- | ---------------------------------------- | -------- | ------- | | multiple | 是否允许多张上传 | boolean | true | | maxSize | 文件的最大体积,单位为M | number | 99999 | | maxFiles | 允许上传的最大文件数 | number | 9 | | accept | 允许上传的文件类型(.png 只接受png图片 image/ ** 接受所有类型的图片 ["image/", "video/mp4"] 只接受图片和mp4的视频 ) | string/string[] | | |url| 上传服务器地址 | string|| |listType|文件列表展示形式('block'/'list')| string | block| |value|已经上传的文件| object[] | | |onError|上传过程中服务器报错后的回调函数| (data) => void|| |onChange | 文件上传到服务器后的回调函数 | (data) => void | | |onDelete | 删除附件的回调函数 | (data) => void | | |parseResponse| 附件上传成功后的回调函数,用来解析后端返回的数据| (data) => object| | |customButton | 自定义的上传按钮| JSX.Element | | |showFileList | 是否显示附件列表| boolean | true | |isPreview | 是否用于表单展示态 | boolean | false |

已选值example
    const defaultValue = [
        {
            id:'1',
            name: '1.jpg',
            status: 'done',
            mediaType: 'jpg',
            downloadUrl:'http://a.hiphotos.baidu.com/image/h%3D300/sign=455610afdfc8a786a12a4c0e5708c9c7/5bafa40f4bfbfbedcb2d862a76f0f736afc31f6a.jpg', 
            previewUrl: 'http://a.hiphotos.baidu.com/image/h%3D300/sign=455610afdfc8a786a12a4c0e5708c9c7/5bafa40f4bfbfbedcb2d862a76f0f736afc31f6a.jpg'
        },
        {
            id:'2',
            name: '2.jpg',
            status: 'done',
            mediaType: 'jpg',
            downloadUrl: 'http://c.hiphotos.baidu.com/image/pic/item/f9198618367adab400b6982c85d4b31c8701e47f.jpg',
            previewUrl: 'http://c.hiphotos.baidu.com/image/pic/item/f9198618367adab400b6982c85d4b31c8701e47f.jpg'
        },
        {
            id:'3',
            name: '3.jpg',
            status: 'done',
            mediaType: 'jpg',
            downloadUrl: 'http://e.hiphotos.baidu.com/image/pic/item/574e9258d109b3dea897b509c2bf6c81800a4ca2.jpg',
            previewUrl: 'http://e.hiphotos.baidu.com/image/pic/item/574e9258d109b3dea897b509c2bf6c81800a4ca2.jpg'
        },
        {
            id:'4',
            name: '4.jpg',
            status: 'done',
            mediaType: 'jpg',
            downloadUrl: 'http://a.hiphotos.baidu.com/image/pic/item/ac4bd11373f08202e2518d6d45fbfbedaa641ba4.jpg',
            previewUrl: 'http://a.hiphotos.baidu.com/image/pic/item/ac4bd11373f08202e2518d6d45fbfbedaa641ba4.jpg'
        },
        {
            id:'5',
            name: '5.jpg',
            status: 'done',
            mediaType: 'jpg',
            downloadUrl: 'http://f.hiphotos.baidu.com/image/pic/item/8644ebf81a4c510fbc2b0d4d6e59252dd52aa5fe.jpg',
            previewUrl: 'http://f.hiphotos.baidu.com/image/pic/item/8644ebf81a4c510fbc2b0d4d6e59252dd52aa5fe.jpg'
        },
        {
            id:'6',
            name: '6.jpg',
            status: 'done',
            mediaType: 'jpg',
            downloadUrl:'http://e.hiphotos.baidu.com/image/pic/item/bf096b63f6246b60885f311be5f81a4c510fa208.jpg', 
            previewUrl: 'http://e.hiphotos.baidu.com/image/pic/item/bf096b63f6246b60885f311be5f81a4c510fa208.jpg'
        }
    ]
parseResponse
此函数用来解析上传接口返回的数据,并根据返回的数据构造出符合要求的数据结构,此函数返回的数据用来显示附件列表、处理图片上传以及下载
{
            id:string, // 必须返回的参数
            name:stirng, // 附件的名称
            status?: EStatus,// 该文件的上传状态,非必填,默认是EStatus.done,如果不是该状态,需要调用 EStatus对象,并使用正确的标识
            mediaType: 'string', // 必填,代表文件的类型 比如jpg png
            downloadUrl?: string, // 如果需要支持附件下载,需要传递此参数
            previewUrl?: string // 如果需要支持附件预览,需要传递此参数
        }