How to use iView+.Net Core to upload pictures in VUE

This article focuses on "how to use iView+.Net Core to upload pictures in VUE". Interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Let's let the editor take you to learn how to upload pictures using iView+.Net Core in VUE.

First of all, you need to create a WebApi project. After you have created it, you can create a folder name under the wwwroot file at will. Here, it is called Upload.

Ok! Then we create a controller IndexController with the following code

You should know that all uploaded pictures are requested through HTTP, and the server reads them from request.

Public class PicData {public string Msg {get; set;}} [HttpPost] public async Task InsertPicture ([FromServices] IHostingEnvironment environment) {var data = new PicData (); string path = string.Empty; var files = Request.Form.Files If (files = = null | | files.Count () allowType.Contains (c.ContentType)) {if (files.Sum (c = > c.Length) {options.AddPolicy ("hehe", p = > p.AllowAnyMethod () / / allow any method GET,POST,PUT,DELETE OPTIONS .AllowAnyHeader () / / allow any request header. AllowAnyOrigin () / / allow any address) });}

The ConfigureServices method, and then the Configure method

Public void Configure (IApplicationBuilder app, IHostingEnvironment env) {app.UseStaticFiles (); app.UseCors ("hehe"); if (env.IsDevelopment ()) {app.UseDeveloperExceptionPage ();} app.UseMvc ();}

Ok is done.

And then we're going to create the Vue project.

Use npm to create a vue project, vue init webpack file let's skip the creation process

Use npm to reference iview and then in main.js in the vue project

Import iView from 'iview';import' iview/dist/styles/iview.css';import locale from 'iview/dist/locale/en-US';Vue.use (iView, {locale})

Ok, and then we write code in app.vue.

Upload files so far, I believe you have a deeper understanding of "how to use iView+.Net Core to upload pictures in VUE". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!