项目中用到了上传图片的功能,记录一下。增强记忆。

要上传图片首先就要先选择图片,或者是先拍照,此时先调用的是 chooseImage 接口,此接口可选择拍照也可以从相册中选择。

它有几个参数,具体可以查看文档,这些参数控制了上传图片的张数、是否压缩、来源等信息。

此接口调用成功会返回一个 临时路径,不管是要预览图片还是要上传到服务器都需要这个路径。同时,上传时还需要一个name属性,必须为 file 必须为 file 必须为 file官方示例

 uni.chooseImage({
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
uni.uploadFile({
url: 'https://www.example.com/upload', //仅为示例,非真实的接口地址
filePath: tempFilePaths[0],
name: 'file',
formData: {
'user': 'test'
},
success: (uploadFileRes) => {
console.log(uploadFileRes.data);
}
});
}
});

uniApp上传图片的更多相关文章

  1. uni-app - 上传图片组件

    2018-12-29 更新1.0  2019-01-08 更新1.1 2019-01-29 更新1.3   重大更新 插件地址: http://ext.dcloud.net.cn/plugin?id= ...

  2. uniapp上传图片转base64码

    uni.chooseImage({ count: 9, success: res => { this.imageList = this.imageList.concat(res.tempFile ...

  3. uniapp上传图片后台返回url后放入image中图片不显示问题

    原因:后台返回路径问题后台返回地址斜杠为 \ 我们需要的是 /  如下后台返回的地址导致转义了 修改后可以显示

  4. uniapp上传图片转base64码案例

    uni.chooseImage({ count: 9, success: res => { this.imageList = this.imageList.concat(res.tempFile ...

  5. uni-app开发小程序入门到崩溃

    最近一段时间公司要做一个小程序项目,还要支持,微信小程序,头条小程序,百度小程序.一套代码,实现三个平台.当时接到这个任务,就不知道怎么去下手,一套代码,分别要发布三个平台,赶紧就去上网了解这些东西, ...

  6. uni-app实现图片和视频上传功能

    使用uni-app实现点击上传,既可以上传视频,有可以上传图片,图片预览,删除图片和视频功能,最终效果如下.uni-app里面没有提供同时上传视频和图片这个插件,只能靠自己手写,  1.页面布局 通过 ...

  7. uniapp安卓ios百度人脸识别、活体检测、人脸采集APP原生插件

    插件亮点 1 支持安卓平板(横竖屏均可),苹果的iPad.2 颜色图片均可更换. 特别提醒 此插件包含 android 端和 iOS 端,考虑到有些同学只做其中一个端的 app,特意分为 2 个插件, ...

  8. uni-app开发经验分享五: 解决三端页面兼容问题的方法

    在做uni-app开发的过程中,我们最头疼可能不是开发的过程中的逻辑,而是最后要做的三端兼容测试和修改,在我开发的项目中,这一步都是最头疼和令人头秃的过程,这里总结一些个人开发遇到的问题,希望对大家有 ...

  9. uni-app小白入门自学笔记(二)

    码文不易啊,转载请带上本文链接呀,感谢感谢 https://www.cnblogs.com/echoyya/p/14429616.html 目录 码文不易啊,转载请带上本文链接呀,感谢感谢 https ...

随机推荐

  1. POJ-2661Factstone Benchmark

    Factstone Benchmark Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 5577   Accepted: 25 ...

  2. vue-cli安装以及创建一个简单的项目(二)(vuex使用、发行一个简单的app)

    1.vuex的使用 vuex是vue的状态管理中心,vuex来保存我们需要管理的状态值,值一旦被修改,所有引用该值的地方就会自动更新,常用于: 1.多个视图依赖同一状态(l例:菜单导航) 2.来自不同 ...

  3. Missing artifact com.lowagie:itextasian:jar:2.1.7

    在maven中添加iTextAsian支持   导入maven项目 发现pom.xml文件 中这个依赖报错:Missing artifact com.lowagie:itextasian:jar:2. ...

  4. JVM的监控工具之jinfo

    参考博客:https://www.jianshu.com/p/8d8aef212b25 jinfo(ConfigurationInfoforJava)的作用是实时地查看和调整虚拟机各项参数,使用jps ...

  5. MySQL分析数据运行状态利器【show full processlist】

    原文地址:https://www.cnblogs.com/shihuc/p/8733460.html 今天的主角是: SHOW [FULL] PROCESSLIST show full process ...

  6. Laravel应用 -- 脚本任务

    大多数项目在业务发展过程中,都需要修复历史数据和定时任务来完成一些业务逻辑,这部分通常都需要通过脚本来完成,一般的框架爱也都提供这部分的功能,学习并使用是工作中的基本要求. 基本流程 commands ...

  7. C#关于函数重载的坑

    今天在调用被重载的函数时,发现一个问题 private ProductRegisterResponse InitResponse(int code, string message, string pw ...

  8. asp.net实现页面跳转后不可以返回

    window.history.go(0); Response.Write("<script> window.history.go(0);alert('恭喜user注册成功!!!\ ...

  9. java.lang.NoSuchMethodError的通用解决思路

    NoSuchMethodError中文意思是没有找到方法,遇到这个错误并不是说依赖的jar包.方法不存在而找不到,这就类似于 ClassNotFoundException错误了,出现ClassNotF ...

  10. 前端开发CSS3——使用方式和选择器

    CSS是Cascading Style Sheets(层叠样式表)的简写,用于修饰文档的语言,可以修饰HTML.XML.SVN.每个语言都有每个语法的规则:CSS声明.CSS声明块.CSS选择器.CS ...