更新记录
1.0.1(2022-07-08) 下载此版本
更新
1.0.0(2022-07-08) 下载此版本
发布初版1.0.0
平台兼容性
uni-app
Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
---|---|---|---|---|---|---|---|---|
- | - | √ | - | √ | √ | - | - | - |
微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 快应用-华为 | 快应用-联盟 |
---|---|---|---|---|---|---|---|---|---|---|
√ | - | - | - | - | - | - | - | - | - | - |
其他
多语言 | 暗黑模式 | 宽屏模式 |
---|---|---|
× | × | √ |
功能介绍
- 简洁的图片上传组件(适用于
移动端
)
使用方法
-
uni_modules
方式- 点击右上角的
使用 HBuilder X 导入插件
按钮直接导入项目或点击下载插件 ZIP
按钮下载插件包并解压到项目的uni_modules/photo-upload
目录下 - 在需要使用页面的
(n)vue
文件中添加<!-- 不需要引入,可直接使用 --> <photo-upload @funImg="funImg" :imgList="imageList" :imgApi="imgApi"/>
export default { data() { return { imgApi:'https://xxx.xxx.xxx/upload', imageList:[], } }, methods:{ funImg(e){ //e 获取返回图片路径集合 } } }
- 需要更新版本时在
HBuilder X
中右键uni_modules/photo-upload
目录选择从插件市场更新
即可
- 点击右上角的
-
npm
方式- 在项目根目录下执行
npm i wwk-photo-upload
- 当前页引入
import photoUpload from 'wwk-photo-upload/photo-upload' export default { data() { return { imgApi:'https://xxx.xxx.xxx/upload', imageList:[], } }, methods:{ funImg(e){ //e 获取返回图片路径集合 } } }
- main全局注册
import photoUpload from 'wwk-photo-upload/photo-upload' Vue.component('photoUpload', photoUpload)
- 在项目根目录下执行
组件属性
属性 | 类型 | 默认值 | 说明 |
---|---|---|---|
imgList | Array | [] | 图片集合 |
disabled | Boolean | false | 组件是否禁用(用于类似详情页面预览时启用) |
组件事件
名称 | 触发时机 |
---|---|
funImg | 上传成功后触发 |
api
组件实例 imgApi
需提供有效上传地址
名称 | 作用 |
---|---|
imgApi | 上传图片地址 |