小程序授权获取头像

news/2024/7/20 4:06:55 标签: 小程序, 前端, javascript

wxml

<view class="header">
  <text>头像</text>
  <button class="butt" plain="true" open-type="chooseAvatar" bind:chooseavatar="chooseAvatar">
    <image src="{{HeadUrl}}" mode="" style="width: 70px;height: 70px;margin-top: 20px;" />
  </button>
</view>

js

javascript">page({
  data: {
    HeadUrl: 'https://pic.imgdb.cn/item/64367f2c0d2dde5777557749.png' //默认头像(登录前)

  },
// 头像
  chooseAvatar(e) {
    const {
      avatarUrl
    } = e.detail
    console.log(avatarUrl); //本地图片
    wx.uploadFile({
      url: 'https://travel.kuxia.top/api/science/upload',
      filePath: avatarUrl,
      name: 'file',
      success: (res) => {
        var data = JSON.parse(res.data);
        console.log('https://travel.kuxia.top' + data.front_file); //服务器图片
        this.setData({
          HeadUrl: 'https://travel.kuxia.top' + data.front_file,
          // HeadUrl: data.front_file
        })
        wx.showToast({
          title: '上传成功',
          icon: 'success',
          duration: 2000 //持续的时间
        })
      },
      fail: (err) => {
        console.log(err);
      }
    })
  },
})

效果:


http://www.niftyadmin.cn/n/5192118.html

相关文章

栈与队列:用栈实现队列

目录 题目&#xff1a; 栈与队列的数据模型对比&#xff1a; 思路分析&#x1f387;&#xff1a; 代码分析&#xff1a; 一、定义队列 二、初始化队列 三、入队 四、出队⭐ 代码解析&#xff1a; 五、获取队头元素 六、查看队列是否为空 七、销毁队列 完整代码 …

py 字符串转INT

在Python中&#xff0c;可以使用内置的int()函数将字符串转换为整数&#xff08;INT&#xff09;。以下是一个简单的示例&#xff1a; s "123" i int(s) print(i) # 输出&#xff1a;123在上述代码中&#xff0c;我们首先定义了一个字符串s&#xff0c;它包含了一…

Spring学习②__IOC分析

目录 IOC控制反转IOCIOC理论案例IOC的思想&#xff08;注入&#xff09;IOC底层什么是 IOCIOC 底层原理 总结 IOC 控制反转IOC ①控制反转&#xff0c;把对象创建和对象之间的调用过程&#xff0c;交给Spring进行 ②使用IOC目的&#xff1a;为了耦合度降低 IOC理论案例 控制…

【音视频基础】AVI文件格式

AVI文件采用的是RIFF文件结构方式。波形音频wave&#xff0c;MIDI和数字视频AVI都采用这种格式存储。 AVI文件的整体结构如下图所示 构造RIFF文件的基本单元叫做数据块&#xff08;Chunk&#xff09;&#xff0c;每个数据块包含3个部分 4字节的数据块标记&#xff08;或者叫…

[内存泄漏][PyTorch](create_graph=True)

PyTorch保存计算图导致内存泄漏 1. 内存泄漏定义2. 问题发现背景3. pytorch中关于这个问题的讨论 1. 内存泄漏定义 内存泄漏&#xff08;Memory Leak&#xff09;是指程序中已动态分配的堆内存由于某种原因程序未释放或无法释放&#xff0c;造成系统内存的浪费&#xff0c;导致…

Vue理解01

项目建立流程 项目文件夹终端vue ui可视化新建项目&#xff08;需要一些时间&#xff09;vscode打开项目npm run serve运行 架构理解&#xff1a; 首先打开的页面默认是index.htmlindex.html默认引用main.jsmain.js引用需要的页面&#xff0c;默认App.vue。Vue示例挂载可以在…

使用SpringBoot进行游戏服务器开发

背景&#xff1a; 之前一直只考虑用JavaSe进行游戏服务器开发&#xff0c;目前项目使用了Spring&#xff0c;发现还是非常好的&#xff0c;好处如下: 好处1:依赖注入非常方便&#xff0c;我们只使用Spring最基本的功能即可&#xff0c;这样子就算是有一些模块不使用Spring管理…

【Proteus仿真】【51单片机】防火防盗GSM智能家居设计

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真51单片机控制器&#xff0c;使用声光报警模块、LCD1602显示模块、DS18B20温度、烟雾传感器模块、按键模块、PCF8591 ADC模块、红外检测模块等。 主要功能&#xff1a; 系统运行后…