48 lines
1.2 KiB
Vue
48 lines
1.2 KiB
Vue
<template>
|
|
<div style="display: flex; flex-direction: column; justify-content: center">
|
|
<input
|
|
type="file"
|
|
@change="uploadImage"
|
|
ref="fileInput"
|
|
style="display: none"
|
|
/>
|
|
<el-button type="success" @click="openFileInput">上传照片</el-button>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import axios from "axios";
|
|
export default {
|
|
name: "Upload",
|
|
data() {
|
|
return {
|
|
photo: "",
|
|
};
|
|
},
|
|
methods: {
|
|
openFileInput() {
|
|
this.$refs.fileInput.click();
|
|
},
|
|
uploadImage(event) {
|
|
var file = event.target.files[0];
|
|
var formData = new FormData();
|
|
formData.append("image", file);
|
|
formData.append("token", "1c17b11693cb5ec63859b091c5b9c1b2");
|
|
axios
|
|
.post("http://8.141.3.231:40061/api/index.php", formData, {
|
|
headers: {
|
|
"Content-Type": "multipart/form-data",
|
|
},
|
|
})
|
|
.then((response) => {
|
|
this.$emit("upload-success", response.data.url);
|
|
this.$message({ type: "success", message: "上传成功" });
|
|
})
|
|
.catch((error) => {
|
|
this.$message.error("上传图片失败:" + error);
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|