当前位置: 首页 > news >正文

【微信小程序】上传头像 微信小程序内接小程序客服

这里写目录标题

  • 微信小程序上传头像
    • 使用button按钮包裹img
  • 微信小程序内接小程序客服
    • 使用button按钮跳转客服

微信小程序上传头像

在这里插入图片描述

使用button按钮包裹img

原本思路是只使用image标签再加上chooseImg,但发现使用button标签上传头像这种方法更实用。微信小程序文档上,button的 open-type 功能有很多
在这里插入图片描述
在这里插入图片描述

  <buttonstyle="border-radius: 50%;"open-type="chooseAvatar"bindchooseavatar="getPropertyPortrait"><image style="margin: 0rpx;" src="{{headimg?headimg:'https://ys.zye.com/upload/touxiang.png' }}"></image></button>
  // 上传头像getPropertyPortrait(e){var that = this;var image =  e.detail.avatarUrl;// 调用上传函数imageUpload.uploadImage('/api/upload/headimg', image, 'file', {}).then((response) => {console.log('上传成功', response);that.setData({headimg: 'https://ys.zye.com' + response.data.pic_path})//上传之后在调用修改头像函数that.updePropertyPortrait('https://ys.zye.com' + response.data.pic_path);}).catch((error) => {console.error('上传失败', error);toast.showError(error.errMsg);});},// 修改头像updePropertyPortrait(pic_path){var that = this;var data = {token:app.globalData.token,headimg:pic_path}api.post('/api/member/moheadimg', JSON.stringify(data)).then((response) => {console.log('修改头像==》',response);if(response.code == 0){that.getPropertyDetails();}else{toast.showError(response.message);}}).catch((error) => {toast.showError(error.errMsg);});},

微信小程序内接小程序客服

内接公司内部的小程序客服,先在微信公众平台设置小程序客服,然后使用button的open-type设置成contact,再进行事件对接。

在这里插入图片描述

使用button按钮跳转客服

  <button class="containedwhd"open-type="contact"send-message-title="客服"show-message-card="true"bindcontact="contactEvent"><image class="left_ls" src="https://ys.ziye.com/upload/iocn/kefu.png"></image><view class="keda">客服</view></button>
Page({// 客服contactEvent(e){console.log(e,'客服===>')console.log(e.detail.path)console.log(e.detail.query)}, 
})
http://www.lryc.cn/news/251873.html

相关文章:

  • 【c++随笔15】c++常用第三方库
  • 数据结构 | 查漏补缺之ASL、
  • 泊车功能专题介绍 ———— 汽车全景影像监测系统性能要求及试验方法(国标未公布)
  • 【Linux】第二十六站:软硬链接
  • 开源播放器GSYVideoPlayer + ViewPager2 源码解析
  • 重启路由器可以解决N多问题?
  • Python WebSocket 客户端教程
  • 洛谷 P2984 [USACO10FEB] Chocolate Giving S
  • 【专题】【数列极限】
  • oracle基础系统学习文章目录
  • 长度最小的子数组(Java详解)
  • 计算机组成学习-数据的表示和运算总结
  • 目标检测YOLO系列从入门到精通技术详解100篇-【目标检测】机器视觉(基础篇)(八)
  • 【4】基于多设计模式下的同步异步日志系统-框架设计
  • Jupyter Markdown 插入图片
  • web自动化 -- pyppeteer
  • Java 数组另类用法(字符来当数组下标使用)
  • error转string
  • Android监听用户的截屏、投屏、录屏行为
  • MATLAB算法实战应用案例精讲-【路径规划】 图搜索算法
  • Elasticsearch-Kibana使用教程
  • mysql(八)docker版Mysql8.x设置大小写忽略
  • KALI LINUX攻击与渗透测试
  • vue之mixin混入
  • [ffmpeg] find 编码器
  • Android CardView基础使用
  • 云原生Kubernetes系列 | init container初始化容器的作用
  • 汽车电子芯片介绍之Aurix TC系列
  • Linux 设置程序开机自启动的方法
  • java企业财务管理系统springboot+jsp