.net core mvc axios 文件上传

@{
    Layout = "~/Views/Shared/_CRM.cshtml";
}
<style>
    #fileType {
        display: none;
    }

    div.file-listing {
        height: 30px;
        line-height: 30px;
        margin: 5px auto;
        background-color: lightblue;
    }

    span.remove-file {
        color: red;
        cursor: pointer;
        float: right;
    }
</style>
<script src="~/lib/home/test.js"></script>
<div id="app">
    <div>
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3>title</h3>
            </div>
            <div class="panel-body">
                <div class="form-group">
                    <div class="row">
                        <input type="text" class="col-sm-2" placeholder="请选择文件" />
                        <input type="file" ref="file" class="col-sm-3" v-on:change="handleFileUpload()" />
                        <button class="col-sm-1 btn btn-primary" v-on:click="uploadFile()">上传单文件</button>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <input type="file" class="col-sm-3" ref="files" multiple v-on:change="handleFileUpload2()" />
                        <button class="col-sm-2 btn btn-primary" v-on:click="uploadFile2()">上传多文件,无列表</button>
                    </div>
                </div>
                <div class="form-group">
                    <div class="row">
                        <template>
                            <div class="container">
                                <div class="">
                                    <label>
                                       文件列表
                                        <input type="file" id="fileType" ref="files3" multiple v-on:change="handleFileUpload3()" />
                                    </label>
                                </div>
                                <div class="">
                                    <div v-for="(file, key) in files3" class="form-control file-listing">
                                        {{ file.name }}
                                        <span class="remove-file" v-on:click="removeFile( key )">
                                            删除文件
                                        </span>
                                    </div>
                                </div>
                                <br>
                                <div class="">
                                    <button class="btn btn-primary" v-on:click="addFiles()">添加文件</button>
                                    <button class="btn btn-primary" v-on:click="submitFiles()">上传多文件,有列表</button>
                                </div>
                            </div>
                        </template>
                    </div>
                </div>
            </div>
            <div class="panel-footer">

            </div>
        </div>

    </div>
</div>

$(function () {
    $('title').text('file upload');
    var data = { file: "", files: "", files3: [] };
    var app = new Vue({
        el: "#app",
        data: data,
        mounted: function () {
        },
        methods: {
            /*单文件上传开始*/
            handleFileUpload: function () {
                this.file = this.$refs.file.files[0];
            },

            uploadFile: function () {
                let formData = new FormData();
                formData.append('file', this.file);
                axios.post('/Home/SubmitFile',
                    formData,
                    {
                        headers: { 'Content-Type': 'multipart/form-data' }
                    }
                ).then(function (res) {
                    alert(res.data.message);
                }).catch(function () {
                    alert(res.data.message);
                });
            },

            /*单文件上传结束*/

            /*多文件上传开始*/

            handleFileUpload2: function () {
                this.files = this.$refs.files.files;
            },

            uploadFile2: function () {
                let formData = new FormData();
                for (var i = 0; i < this.files.length; i++) {
                    formData.append('file[' + i + ']', this.files[i]);
                }
                axios.post('/Home/SubmitFile2',
                    formData,
                    {
                        headers: { 'Content-Type': 'multipart/form-data' }
                    }
                ).then(function (res) {
                    alert(res.data.message);
                }).catch(function () {
                    alert(res.data.message);
                });
            },
            /*多文件上传结束*/

            /*多文件 并且带列表的上传开始 能看到上传文件的列表，并能删除，添加新的文件到列表中*/
            addFiles: function () {
                this.$refs.files3.click();
            },

            handleFileUpload3: function () {
                let uploadedFiles = this.$refs.files3.files;
                for (var i = 0; i < uploadedFiles.length; i++) {
                    this.files3.push(uploadedFiles[i]);
                }
            },

            removeFile(key) {
                this.files3.splice(key, 1);
            },

            submitFiles: function () {
                let formData = new FormData();
                for (var i = 0; i < this.files3.length; i++) {
                    formData.append('file[' + i + ']', this.files3[i]);
                }
                axios.post('/Home/SubmitFile2',
                    formData,
                    {
                        headers: { 'Content-Type': 'multipart/form-data' }
                    }
                ).then(function (res) {
                    alert(res.data.message);
                    data.files3.length = 0;
                }).catch(function (res) {
                    alert(res.data.message);
                });
            }
            /*多文件 并且带列表的上传结束*/
        }
    })
})

 [HttpPost]
        public IActionResult SubmitFile()
        {
            int n = this.Request.Form.Files.Count;
            if (n > 0)
            {
                string dir = Path.Combine(webEnv.WebRootPath, "upload");
                if (!Directory.Exists(dir))
                    Directory.CreateDirectory(dir);
                foreach (IFormFile item in this.Request.Form.Files)
                {
                    string fullPath = Path.Combine(dir, item.FileName);
                    using (Stream fs = System.IO.File.Create(fullPath))
                    {
                        item.CopyTo(fs);
                    }
                }
                return Json(ResultData("ok"));
            }
            return Json(ResultData("没有接收到文件！", "", (int)ErrorInformation.NoFile));
        }

        [HttpPost]
        public IActionResult SubmitFile2()
        {
            return SubmitFile();
        }