vue3+typescript+antdesigner+springboot实现图片上传
时间: 2023-03-14 16:41:04 浏览: 159
Vue3、TypeScript、AntDesigner和SpringBoot可用于实现图片上传功能,其中Vue3可用于构建前端界面,TypeScript可用于编写类型安全的JavaScript代码,AntDesigner可用于提供图片上传的UI组件,而SpringBoot可用于实现服务端的图片上传功能。
相关问题
写一段代码,用vue3+typescript+antdesigner实现图片上传功能
这是一段使用 Vue3、TypeScript 和 AntDesigner 实现图片上传功能的代码:// 安装依赖
npm install vue3 typescript antdesigner// 创建新组件
import { Component, Vue } from 'vue-property-decorator';
import { Upload, message } from 'ant-design-vue';@Component
export default class App extends Vue {
// 声明变量
uploadFileList: any[] = []; // 挂载图片上传组件
handleChange(info: any) {
if (info.file.status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (info.file.status === 'done') {
message.success(`${info.file.name} file uploaded successfully`);
} else if (info.file.status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
} // 渲染上传组件
render() {
return (
<Upload
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
onChange={this.handleChange}
fileList={this.uploadFileList}
>
<Button>
<UploadOutlined /> Upload
</Button>
</Upload>
);
}
}
阅读全文