小程序样式问题

小程序切换下一个文章或者页面,淡入淡出效果

// detail.js
getArticleData: function(articleId) {// 开始淡出效果this.animate('.detail-page', [{ opacity: 1.0, ease: 'ease-out' },{ opacity: 0.0, ease: 'ease-out' }], 500, () => {// 在淡出动画完成后请求文章数据wx.request({url: `${apiBaseUrl}/articles/${articleId}`,method: 'GET',success: (res) => {if (res.data.status === 0) {const data = res.data.data;const articleData = data.current_article;// 更新文章数据this.setData({title: articleData.title,htmlContent: articleData.content,nextArticleId: data.next_article_id,previousArticleId: data.previous_article_id,});// 开始淡入效果this.animate('.detail-page', [{ opacity: 0.0, ease: 'ease-in' },{ opacity: 1.0, ease: 'ease-in' }], 500);} else {// 错误处理console.error('获取文章数据失败:', res.data.message);}},fail: (err) => {console.error('请求文章数据失败:', err);}});});
}

小程序滚动加载上一页或者下一页,滚动条不回顶部的问题

尝试了各种方案效果不是很理想,最终直接采用跳转的方案

wx.redirectTo({url: '/pages/index/detail?id=' + this.data.previousArticleId});

图片高度不能自适应宽度的问题

<image class="card-image" src="{{item.cover_image}}" mode="aspectFill"></image>
<image class="card-image" src="{{item.cover_image}}" mode="widthFix"></image>

主要问题在于mode,这里有多种模式,aspectFill这种就是显示中间一块
widthFix则是自适应宽高

头像获取问题

现在头像已经不支持点击获取了,也就说下面两种方式都失效了

  getUserProfile(e) {// 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认,开发者妥善保管用户快速填写的头像昵称,避免重复弹窗wx.getUserProfile({desc: '展示用户信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写success: (res) => {console.log(res)this.setData({userInfo: res.userInfo,hasUserInfo: true})}})},getUserInfo(e) {// 不推荐使用getUserInfo获取用户信息,预计自2021年4月13日起,getUserInfo将不再弹出弹窗,并直接返回匿名的用户个人信息console.log(e)this.setData({userInfo: e.detail.userInfo,hasUserInfo: true})}

现在采用的方式为用户设置的方式。具体文档见:微信文档
相关代码

<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar"><image class="avatar" src="{{avatarUrl}}"></image>
</button> 
<input type="nickname" class="weui-input" placeholder="请输入昵称"/>const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'Page({data: {avatarUrl: defaultAvatarUrl,},onChooseAvatar(e) {const { avatarUrl } = e.detail this.setData({avatarUrl,})}
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/143250.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

《QT从基础到进阶·二十六》绘制多个图形项(QGraphicsRectItem,QGraphicsLineItem,QGraphicsPolygonItem)

这个demo用QT实现了对多个图形项的绘制&#xff0c;包括矩形的绘制&#xff0c;直线的绘制和多边形的绘制&#xff0c;是之前一章中绘制矩形的增强版&#xff0c;之前一章节关于矩形的绘制可以参考&#xff1a;《QT从基础到进阶十五》用鼠标绘制矩形&#xff08;QGraphicsView、…

Web安全:Vulfocus 靶场搭建.(漏洞集成平台)

Web安全&#xff1a;Vulfocus 靶场搭建.&#xff08;漏洞集成平台&#xff09; Vulfocus 是一个包含了多种漏洞靶场的镜像。每个靶场都有具体的漏洞环境和攻击点。Vulfocus 的靶场包括了 Web 安全漏洞、系统安全漏洞、网络安全漏洞、密码学漏洞等多种类型。通关这个靶场我们可以…

基于STM32的物联网体感控制机械臂

摘 要 随着我国微型电子技术和嵌入式系统的发展&#xff0c;目前行业内相对比较传统的机械臂无法满足客户的需求。为了改进传统机械臂在控制上得短板问题&#xff0c;在本次毕业设计中&#xff0c;将使用相对先进、快捷、智能的控制机制。该系统的控制大脑为核心控制器32系列嵌…

哪些方面的应用适合博捷芯双轴半自动划片机?

博捷芯BJX3666系列双轴半自动划片机可以应用于以下领域&#xff1a; 1. 集成电路制造&#xff1a;在集成电路制造中&#xff0c;划片机可以用来将芯片从晶圆上切割下来&#xff0c;以便进行封装和测试。此外&#xff0c;还可以用来对芯片进行划片分离加工&#xff0c;以得到所需…

Java整合Redis实现坐标附近查询

目录 一、GEO用法引入 二、引入依赖 三、实体类 四、添加位置信息 五、查询位置信息 一、GEO用法引入 GEO&#xff0c;全称Geolocation&#xff0c;代表地理坐标。可以在其中存储地理坐标信息&#xff0c;帮助我们根据经纬度来检索数据。常见的命令有&#xff1a;GEOADD&…

python 爬虫之urllib 库的相关模块的介绍以及应用

文章目录 urllib.request 模块打开 URL&#xff1a;发送 HTTP 请求&#xff1a;处理响应&#xff1a; 应用如何读取并显示网页内容提交网页参数使用HTTP 代理访问页面 urllib.request 模块 在 Python 中&#xff0c;urllib.request 模块是用于处理 URL 请求的标准库模块之一。…

学习c#的第十一天

目录 C# 结构体&#xff08;Struct&#xff09; 定义结构体 C# 结构的特点 类 vs 结构 C# 枚举&#xff08;Enum&#xff09; 声明 enum 变量 实例 C# 结构体&#xff08;Struct&#xff09; 定义结构体 在 C# 中&#xff0c;定义结构体使用关键字 struct。下面是一个…

【JMeter】组件之 Listener监听器选择

JMeter中监听器的作用就是收集、显示JMeter取样器的结果&#xff0c;并以树形、图表、表格的形式显示出来。还可以将监听结果保存成文件。 View Results Tree-->察看结果树 Summary Report-->汇总报告 为测试中的每个不同命名的请求创建一行。这与聚合报告类似&#xff…

C与汇编深入分析

汇编怎么调用C函数 直接调用 BL main传参数 在arm中有个ATPCS规则&#xff08;ARM-THUMB procedure call standard&#xff09;&#xff08;ARM-Thumb过程调用标准&#xff09;。 约定r0-r15寄存器的用途&#xff1a; r0-r3&#xff1a;调用者和被调用者之间传递参数r4-r11…

Java --- JVM之垃圾回收概述

目录 一、什么是垃圾 二、为什么需要GC 三、早期垃圾回收行为 四、Java垃圾回收机制 一、什么是垃圾 1、垃圾收集&#xff0c;不是Java语言的伴生产物。早在1960年&#xff0c;第一门开始使用内存动态分配和垃圾收集技术的Lisp语言诞生。 2、垃圾收集机制是Java语言的招牌…

用Go实现yaml文件节点动态解析

1.摘要 在大多数Go语言项目中, 配置文件通常为yaml文件格式, 在文件中可以设置项目中可灵活配置的各类参数, 通常这类参数都是比较固定的, 可以将其映射为对应的结构体在项目中进行使用, 如果需要调整参数时, 只需要增减结构体参数字段内容即可。 但同时还存在另外一种情况, …

设计测试用例的6种基本原则

设计测试用例的基本原则&#xff0c;对于软件测试非常重要&#xff0c;这些原则有助于设计出高质量、全面、有效的测试用例&#xff0c;从而提高软件测试的效率和准确性&#xff0c;维护软件的质量和稳定。如果在设计用例时没有遵循基本原则&#xff0c;这会影响用例的全面性、…

百望云斩获“新华信用金兰杯”ESG优秀案例 全面赋能企业绿色数字化

近年来&#xff0c;中国ESG蓬勃发展&#xff0c;在政策体系构建、ESG信披ESG投资和国际合作等方面都取得了阶段性成效&#xff0c;ESG生态不断完善。全社会对ESG的认识及实践也在不断深化&#xff0c;ESG实践者的队伍在不断发展壮大。 ESG作为识别企业高质量发展的重要指标&…

WebSocket魔法师:打造实时应用的无限可能

1、背景 在开发一些前端页面的时候&#xff0c;总是能接收到这样的需求&#xff1a;如何保持页面并实现自动更新数据呢&#xff1f;以往的常规做法&#xff0c;是前端使用定时轮询后端接口&#xff0c;获取响应后重新渲染前端页面&#xff0c;这种做法虽然能达到类似的效果&…

Rust6.1 Writing Automated Tests

Rust学习笔记 Rust编程语言入门教程课程笔记 参考教材: The Rust Programming Language (by Steve Klabnik and Carol Nichols, with contributions from the Rust Community) Lecture 11: Writing Automated Tests src/lib.rs //Tests: Arrange, Act, Assert //#[test] a…

二维码在区域巡查中的应用:隐患上报、巡逻巡更、管线巡查

针对管理制度不健全、维修不及时、纸质表格容易丢失等问题&#xff0c;可以在草料上搭建区域巡查二维码系统。通过组合功能模块的方式&#xff0c;实现扫码记录巡查情况、上报隐患和整改信息、发现异常问题后及时反馈给相关负责人等功能。 比如上海延吉物业管理有限公司搭建的…

uniapp的实战总结大全

&#x1f642;博主&#xff1a;冰海恋雨 &#x1f642;文章核心&#xff1a;uniapp部分总结 目录 ​编辑 目录 前言&#xff1a; 解决方案 1. 跨平台开发 2. Vue.js生态 3. 组件库 4. 自定义组件 5. Native能力 6. 插件生态 7. 性能优化 写法 1. 模板&#xf…

在ant构建脚本中调用maven的命令

有时候想用maven管理依赖&#xff0c;用ant构建。 在ant的build.xml文件中可以使用exec这个task来调用系统命令&#xff0c;也就可以调用maven的命令。 例如&#xff0c;执行maven的命令mvn dependency:copy-dependencies&#xff0c;可以将项目的依赖提取出来&#xff0c;放…

Zookeeper 命令使用和数据说明

文章目录 一、概述二、命令使用2.1 登录 ZooKeeper2.2 ls 命令&#xff0c;查看目录树&#xff08;节点&#xff09;2.3 create 命令&#xff0c;创建节点2.4 delete 命令&#xff0c;删除节点2.5 set 命令&#xff0c;设置节点数据2.6 get 命令&#xff0c;获取节点数据 三、数…

时间序列基础->数据标签、数据分割器、数据加载器的定义和讲解(零基础入门时间序列)

一、本文介绍 各位小伙伴好&#xff0c;最近在发时间序列的实战案例中总是有一些朋友问我时间序列中的部分对数据的操作是什么含义&#xff0c;我进行了挺多的介绍和讲解但是问的人越来越多&#xff0c;所以今天在这里单独发一篇文章来单独的讲一下时间序列中对数据的处理操作…