demo, uploaded pictures provided by 1.element official website
<body>
<div id="app">
<el-upload class="upload-demo" action="http://localhost:63342/springcloudservice/page-server/templates/images/project/"
:on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove"
multiple :limit="3" :on-exceed="handleExceed" :file-list="fileList">
<el-button size="small" type="primary"></el-button>
<div slot="tip" class="el-upload__tip">jpg/png500kb</div>
</el-upload>
</div>
</body>
<script>
var vue=new Vue({
el: "-sharpapp",
data() {
return {
fileList: [
{
name: "food.jpeg",
url: "https://img.codeshelper.com/upload/img/2021/03/01/ne3v1z3qt2m1764.jpg?imageMogr2/thumbnail/360x360/format/webp/quality/100"
},
{
name: "food2.jpeg",
url: "https://img.codeshelper.com/upload/img/2021/03/01/ne3v1z3qt2m1764.jpg?imageMogr2/thumbnail/360x360/format/webp/quality/100"
}
]
};
},
methods: {//
handleRemove:function(file, fileList) {
console.log(file, fileList);
},
handlePreview:function(file) {
console.log(file);
},
handleExceed:function(files, fileList) {// 3 ${files.length} ${files.length + fileList.length}
this.$message.warning("3");
},
beforeRemove:function(file, fileList) {
return this.$confirm(" "+ file.name +"");
}
},
computed: {//
}
})
</script>
The 2.action parameter is the uploaded address. I want to upload it to the images folder of the directory where the project resides. The address is written as
"http://localhost:63342/springcloudservice/page-server/templates/images/"", but the front console reports an error of 404. Can"t I write the address in this way directly?