vue中使用elementUI组件的Upload 上传图片

最新推荐文章于 2024-05-17 14:58:40 发布

Ajaloney

最新推荐文章于 2024-05-17 14:58:40 发布

阅读量362

点赞数 1

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/Ajaloney/article/details/122935505

版权

这篇博客详细介绍了如何在Vue项目中结合ElementUI组件实现手动上传一张图片的功能。首先通过npm安装并引入ElementUI，然后根据Element官网的Upload上传组件文档进行配置。博主的需求是点击保存按钮触发上传，并且需要传递userId作为参数。在Vue的data和methods中定义相关逻辑，最终实现了预期效果。

摘要由CSDN通过智能技术生成

1. 安装elementUI：npm i element-ui -S

2. 在main.js中引入elementUI

import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(Element, {
    size: 'small' })

3. 访问Element官网【组件–Upload上传】

在这里插入图片描述

<el-upload
  action="https://jsonplaceholder.typicode.com/posts/"
  list-type="picture-card"
  :on-preview="handlePictureCardPreview"
  :on-remove="handleRemove">
  <i class="el-icon-plus"><

最低0.47元/天解锁文章

Ajaloney

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
vue中使用elementUI组件的Upload 上传图片

1. 安装elementUI：npm i element-ui -S2. 在main.js中引入elementUIimport Element from 'element-ui'import 'element-ui/lib/theme-chalk/index.css'Vue.use(Element, { size: 'small' })3. 访问Element官网【组件–Upload上传】<el-upload action="https://jsonplaceholder.typi
复制链接

扫一扫