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

just-xlsx-export

v1.0.9

Published

A simple npm package for exporting Excel file

Downloads

5

Readme

一个简陋的导出excel,文件格式为xlsx的包,测试vue2/vue3 webpack脚手架中使用没有问题,vite脚手架中使用出现问题,有待后续解决

1.引入npm包

npm i -s just-xlsx-export

2.项目中进行基本使用

<template>
    <button @click="exportExcel">导出excel</button>
</template>

<script>
import { getSheets, downloadExcel } from 'just-xlsx-export'

export default {
    data () {
        return {
            data:
                [
                    ["", "姓名", "性别", "出生年月", "民族", "籍贯", "政治面貌", "身份证号", "手机号码", "毕业院校", "专业"],
                    [1, "小虎", "男", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员", "123456789012345678", "12345678901", "南京大学", "计算机"],
                    [2, "小鱼", "女", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员", "123456789012345678", "12345678901", "南京大学", "计算机"],
                    [3, "大熊", "男", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员", "123456789012345678", "12345678901", "南京大学", "计算机"],
                    [4, "大牛", "男", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员", "123456789012345678", "12345678901", "南京大学", "计算机"]
                ]
        }
    },
    methods: {
        exportExcel () {
            // 获取相应数据生成的单元格对象,注意,数据格式为[[],[],[],[],[]]
            const sheet = getSheets(this.data)
            // 导出excel
            downloadExcel(sheet, 'xlsx文件名')
        },
    }
}
</script>

3.设置单元格宽度,使用单元格合并,单元格文本居中/Set the excel cell width, use cell merging, and center cell text

<template>
    <button @click="exportExcel">导出excel</button>
</template>

<script>
import { getSheets, downloadExcel } from 'just-xlsx-export'

export default {
    data () {
        return {
            data:
                [
                    ["", "姓名", "性别", "出生年月", "民族", "籍贯", "政治面貌", "身份证号", "手机号码", "毕业院校", "专业"],
                    [1, "小虎", "男", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员", "123456789012345678", "12345678901", "南京大学", "计算机"],
                    [2, "小鱼", "女", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员","123456789012345678", "12345678901",  "南京大学", "计算机"],
                    [3, "大熊", "男", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员","123456789012345678", "12345678901",  "南京大学", "计算机"],
                    [4, "大牛", "男", "1999-06-04", "汉", "江苏-南京市-秦淮区", "共青团员", "123456789012345678", "12345678901",  "南京大学", "计算机"]
                ]
        }
    },
    methods: {
        exportExcel () {
            const arr = Array(11).fill('')
            // 设置需要合并单元格的标题,注意,单元格合并会以单元格首位的文本覆盖所有合并后的单元格中文本,所以这里只需设置首位的文本
            arr[0] = '序号'
            arr[1] = '我的信息'
            arr[4] = '详情信息'
            arr[9] = '教育经历'
            // 数据是[[],[],[],[]]的形式
            const excelData = [arr].concat(this.data)
            const sheet = getSheets(excelData)
            /// 设置单元格合并,'!merges'相当于设置单元格对象的合并规则,r为纵向合并,c为横向合并
            sheet['!merges'] = [
                // r为纵向合并,范围是第1列的行1到行2
                { s: { r: 0, c: 0 }, e: { r: 1, c: 0 } },
                // c为横向合并,范围是第1行的列2到列4
                { s: { r: 0, c: 1 }, e: { r: 0, c: 3 } },
                { s: { r: 0, c: 4 }, e: { r: 0, c: 8 } },
                { s: { r: 0, c: 9 }, e: { r: 0, c: 10 } },
            ];
            // sheet[item].s代表单元格的style,item为单元格的坐标,这里可以设置单元格字体大小,颜色,居中对齐等等,具体参考xlsx-style文档即可
            const styleArr = ['A1', 'B1', 'E1', 'J1']
            styleArr.forEach(item => {
                sheet[item].s = {
                    // 文本居中
                    alignment: {
                        horizontal: 'center',
                        vertical: 'center',
                    }
                }
            })
            // 设置宽度,wpx宽度数值,有多少个单元格设置多少个宽度对象即可
            sheet['!cols'] = [
                {
                    wpx: 150,
                },
                {
                    wpx: 500,
                },
                {
                    wpx: 100,
                },
                {
                    wpx: 150,
                },
                {
                    wpx: 150,
                },
                {
                    wpx: 150,
                },
                {
                    wpx: 200,
                },
            ];
            downloadExcel(sheet, 'xlsx文件名')
        },
    }
}
</script>