@21vianet/excel-uploader 中文文档教程

发布于 3年前 浏览 26 项目主页 更新于 3年前

Excel-Uploader

Overview

Excel-Uploader 是 VUE 的一个组件,它提供了诸如 下载模板excel文件和上传带有后端等功能的excel文件。 它可以帮助开发人员快速编码。

Usage

1,安装

npm install @21vianet/excel-uploader --save

2,在你的项目的main.js中添加如下内容 确保它位于 element-ui 引用之后。

import 'element-ui/lib/theme-chalk/index.css'

import './package/css/uploader-custom.css'

3、插入上传器HTML标记及其参考代码到您的 VUE 组件中。

从“@21vianet/excel-uploader”导入 ExcelUploader

组件:{ ... Excel上传器 ...

在这里,你可以通过样式属性调整它的大小:

style="width: 560px;height: 560px;margin: 30px;"

节点:宽度和高度不要设置小于560px的数字。 它可以确保 UI 看起来正常。

4,给配置ExcelUploader组件一个对象。 所有配置参数如下:

 {
   MaxUploadFileSize: 3,
   DownloadTemplateUrl: '',
   DownloadTemplateRequestBody: {},
   DownloadErrorMessageUrl: '',
   UploadProcessPercentUrl: '',
   UploadFileUrl: ''
 }

5,您可以在用户单击步骤 3 中的“后退”按钮时触发的@backToMenu 事件下标。

Repository

https://github.com/21vianet/excel-uploader.git< /code>

Republic

如果您是来自@21vianet 组的开发人员,您可以下载存储库并注册 ExcelUploader。

1,git clone Repository

2,运行 npm install

3,更改 package 文件夹中的代码。

4、在package文件夹下运行npm publish --access public

Excel-Uploader

Overview

The Excel-Uploader is a component of VUE which provides such as download template excel file and upload excel file with backend, etc functions. It can helps developer coding quickly.

Usage

1,Installation

npm install @21vianet/excel-uploader --save

2,Add the following to your main.js of your project and make sure that it's position after the element-ui reference's.

import 'element-ui/lib/theme-chalk/index.css'

import './package/css/uploader-custom.css'

3,Insert the Uploader HTML tag and its reference code into your VUE component.

import ExcelUploader from '@21vianet/excel-uploader'

components: { ... ExcelUploader ... }

<ExcelUploader :config="getConfig()" @backToMenu="backToMenu"></ExcelUploader>

In here, you can adjust its size via style attribute:

style="width: 560px;height: 560px;margin: 30px;"

Node: Don't set the smaller number than 560px with its width and height. Which it can make sure that the UI looks like normally.

4,Give a object for config ExcelUploader component. All the config params as below:

 {
   MaxUploadFileSize: 3,
   DownloadTemplateUrl: '',
   DownloadTemplateRequestBody: {},
   DownloadErrorMessageUrl: '',
   UploadProcessPercentUrl: '',
   UploadFileUrl: ''
 }

5,You can subscript the @backToMenu event that be triggered when user click the 'Back' button in step 3.

Repository

https://github.com/21vianet/excel-uploader.git

Republic

If you are a developer who from @21vianet group, you can download the repository and republic the ExcelUploader.

1,git clone Repository

2,run npm install

3,change code in package folder.

4,run npm publish --access public under the package folder.

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文