Use of 2017.11.7 ant design-upload components, react conditional rendering and use of Axios.all ()

First, the main task: The Sydney Small Program management backstage, add the attraction page development

Second, the problems encountered and solutions

1. When uploading multiple different classified audio information, such as Chinese audio and English audio, it is required that the audio is not placed in an array, each audio is a separate field, at this point:

<uploadaction= "/hserve/v2/file/upload/"//Required parameters, uploaded address, listtype= "picture"//upload list of the built-in style, this is not very clear text, picture, The difference between Picture-card, the default value is Text;showuploadlist={false}//Whether to show Updatelist, the default value is true;accept= "audio/*"//Accept the uploaded file type, audio/* , video/*, image/*filelist={cnaudiofilelist}//The list of uploaded files, where the initial value of Cnaudiofilelist is empty, and is set by Handleaudiochange after uploading The value of the cnaudiofilelist; Onchange={this.handleaudiochange.bind (this, ' CN ')}//This is because you want to upload the audio in English and Chinese separately, so we have an extra parameter for distinguishing;>  handleaudiochange = (type, {file, fileList}) = {//file: The current file object, FileList: The current list of files, (the custom pass parameter needs to be placed in front of the default parameter) if (File.status = = = ' Done ') {Filelist[filelist.length-1].url = File.response.path let LastFile = filelist[filelist.length-1] if (type = = = ' cn ') {this.setstate ({cnaudiofilelist:filelist, site: {... this.state.site, cnAudio:lastFile.url }})} else {this.setstate ({enaudiofilelist:filelist, site: {... this.state.site, enaudio:l　　Astfile.url}})} return} if (type = = = ' cn ') {this.setstate ({cnaudiofilelist:filelist})} else {this.setstate ({Enaudiofilelist:file　　List})}} 2. react conditional rendering in two ways: (1) Let example = <example {... props}/&gt, and then references {example} in render; (2) directly in render: {condition = = = value? (<div>1</div>): (<div>2</div>)  }; 3. For multiple interfaces with the same parameters, different requests, use Axios.all (), Specific usage: import Axios from ' Axios '   let promises = [];  Promises.push (request1　　[params]) Promises.push (Request2[params]) Axios.all (promises). Then (res = {Console.log (res)/RES as an array, each corresponding to each request}). cat CH (() = {Message.error (' request failed ')})   If you are certain that there are several requests, you can return the parameters separately, that is,  axios.all (promises). Then (Axios.spread ( function (A, b) (= {}))      

Use of 2017.11.7 ant design-upload components, react conditional rendering and use of Axios.all ()