Spring上传文件(upload files)

本文介绍了如何使用前端iView组件和简单的HTML实现文件上传,配合SpringBoot后端利用MultipartFile接收文件。后端通过引入opencsv库对CSV文件进行解析,将数据存入数据库。提供了完整的前后端交互流程和实现效果。
摘要由CSDN通过智能技术生成

前端实现:
可以使用iView组件,实现文件的选择与上传,话不多说,直接上代码(注意,action中的路径及后端接收的路径,name即@RequestParam,通过name后端获取相应文件):

<template>
    <div>
        <Upload
            action="/test"
            name = "etymon"
            :on-success="onFileSuccess"
        >
            <Button icon="ios-cloud-upload-outline">词根同步</Button>
        </Upload>

        <div class="default">
            <Table :columns="columns" :data="data"></Table>
            <div style="margin: 10px;overflow: hidden">
                <div style="float: right;">
                    <Page :total="total" :current="current" @on-change="changePage"></Page>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "sync",
        methods: {
            onFileSuccess(res, file, fileList) {
                this.uploadPercent = 100
                this.data = res.data
                this.total = res.data.size
            },
            changePage(page) {
                this.current = page
     
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值