formData 形式タイプを使用してファイルをアップロードする Vue の例

<el-button type="primary" @click="uploadFile2()">クリックしてアップロード</el-button>
 <input type="file" @change="fileValueChange2()" ref="uploadFile2" enctype="multipart/form-data" style="display:none;" accept="image/jpeg,image/png,image/gif">

アップロードファイル2(){
	// このイベントはボタンがクリックされたときにトリガーされます // この関数はファイルアップロードポップアップボックスを開きます this.$refs.uploadFile2.click()
   },
   ファイル値変更2(){
   // ファイルを選択すると、入力変更イベントがトリガーされ、この関数が入力されます var formData = new FormData()
     // this.$refs.uploadFile2 は Vue で DOM 要素を取得するためのメソッドです // アップロードされたすべてのファイルは files を通じて取得できます。ファイルが複数ある場合は、formData.append('file',this.$refs.uploadFile2.files[0])
     // リクエストタイプを設定する必要があります formData.append('type', "head");
     // ID を渡す必要がある場合は、次のコードを参照してください formData.append('id', this.id);
     // 設定が完了したら、formData 変数をバックエンドに渡すだけです insertNavigationUpload(formData).then(res=>{
       console.log('簡単でしょ？友よ')
     })
   },

エクスポートconst tMessageNotification = data =>{
  リクエストを返す({
    url:'/tMessageNotification/upload',
    メソッド: 'POST'、
    データ、
    ヘッダー: {'Content-Type': 'application/json'},
  })
}