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

这里写目录标题

微信小程序上传头像

使用button按钮包裹img

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

xml 复制代码
  <button
      style="border-radius: 50%;"
      open-type="chooseAvatar"
      bindchooseavatar="getPropertyPortrait"
  >
   <image style="margin: 0rpx;" src="{{headimg?headimg:'https://ys.zye.com/upload/touxiang.png' }}"></image>
  </button>
javascript 复制代码
  // 上传头像
  
  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按钮跳转客服

xml 复制代码
  <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>
javascript 复制代码
Page({
     // 客服
  contactEvent(e){
  
	console.log(e,'客服===>')
	console.log(e.detail.path)
    console.log(e.detail.query)
    
  }, 
})
相关推荐
云起SAAS3 小时前
名字姓名起名打分评分抖音快手微信小程序看广告流量主开源
微信小程序·小程序·ai编程·看广告变现轻·名字姓名起名打分评分
说私域3 小时前
从裂变能力竞争到技术水平竞争:开源AI智能名片链动2+1模式S2B2C商城小程序对微商企业竞争格局的重塑
人工智能·小程序·开源
开发加微信:hedian1166 小时前
短剧小程序开发全攻略:技术选型与实现思路
微信·小程序·架构·aigc·交互
2501_915918416 小时前
移动端 HTTPS 抓包实战,多工具组合分析与高效排查指南
数据库·网络协议·ios·小程序·https·uni-app·iphone
星光一影12 小时前
陪诊陪检系统源码,陪诊小程序,陪诊APP,陪诊服务,家政上门系统,居家护理陪护源码
mysql·小程序·uni-app·php
阿奇__14 小时前
uniapp h5 app 小程序获取当前定位
小程序·uni-app
2501_9151063217 小时前
iOS性能调优的系统化实践,从架构分层到多工具协同的全流程优化指南(开发者深度版)
android·ios·小程序·架构·uni-app·iphone·webview
李纲明19 小时前
Wordpress如何选择适合外贸的模板主题?
微信小程序·php
一 乐19 小时前
游戏助手|游戏攻略|基于SprinBoot+vue的游戏攻略系统小程序(源码+数据库+文档)
数据库·vue.js·spring boot·后端·游戏·小程序
说私域1 天前
开源AI智能名片链动2+1模式S2B2C商城小程序:分享经济时代的技术赋能与模式创新
人工智能·小程序·开源