vue 3.x 中使用ele-image时相对路径的图片加载失败

参考文档: https://element.eleme.cn/#/zh-CN/component/installation

环境: Mac OS X 10.12


[zcm@ele 2]$node -v
v12.6.0
[zcm@ele 3]$npm -v
6.9.0
[zcm@ele 4]$cnpm -v
cnpm@6.1.0 (/usr/local/lib/node_modules/cnpm/lib/parse_argv.js)
npm@6.10.2 (/usr/local/lib/node_modules/cnpm/node_modules/npm/lib/npm.js)
node@12.6.0 (/usr/local/Cellar/node/12.6.0/bin/node)
npminstall@3.22.1 (/usr/local/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js)
prefix=/usr/local 
darwin x64 16.7.0 
registry=https://r.npm.taobao.org

[zcm@ele 6]$vue -V
3.9.2

创建项目: vue create ele

cd ele

cnpm i

npm run serve

项目目录结构

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue-ele-upload-image使用方法如下: 1. 安装vue-ele-upload-image组件 你可以使用npm或者yarn来安装vue-ele-upload-image组件,具体命令如下: ``` npm install vue-ele-upload-image --save ``` 或者 ``` yarn add vue-ele-upload-image ``` 2. 引入vue-ele-upload-image组件 你可以在需要使用vue-ele-upload-image组件的地方引入该组件,具体代码如下: ```javascript import Vue from 'vue' import EleUploadImage from 'vue-ele-upload-image' Vue.use(EleUploadImage) ``` 3. 在模板使用vue-ele-upload-image组件 你可以在模板使用vue-ele-upload-image组件,具体代码如下: ```html <ele-upload-image :action="uploadUrl" :headers="uploadHeaders" :multiple="true" :limit="5" :size="1024 * 1024 * 2" :format="['jpg', 'jpeg', 'png']" :data="uploadData" :before-upload="beforeUpload" :on-success="onSuccess" :on-error="onError" :on-remove="onRemove" > <el-button type="primary">点击上传</el-button> </ele-upload-image> ``` 其,各个参数的含义如下: - `action`:上传图片的地址。 - `headers`:上传图片需要携带的请求头。 - `multiple`:是否支持多选图片,默认为false。 - `limit`:上传图片的最大数量,默认为1。 - `size`:上传图片的最大大小,默认为2MB。 - `format`:上传图片的格式限制,默认为['jpg', 'jpeg', 'png']。 - `data`:上传图片需要携带的额外数据。 - `before-upload`:上传图片前的回调函数。 - `on-success`:上传图片成功的回调函数。 - `on-error`:上传图片失败的回调函数。 - `on-remove`:删除图片的回调函数。 以上就是vue-ele-upload-image组件的使用方法,希望能对你有所帮助。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值