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

uniapp 实战demo

1.uniapp 从列表进入详情页,再返回列表页时回到上次的浏览位置

<script>
export default {data() {return {listData: [],scrollTop: 0,//浏览位置};},onShow() {this.getShopData();},onPageScroll: function (e) {// 当页面滚动时保存值this.scrollTop = e.scrollTop;},onBackPress(options) {//列表页点击页面左上角的返回按钮时从本地缓存中移除指定的keyif (options.from === 'backbutton') {uni.removeStorage({key: 'newsTop'});uni.navigateBack();return true;}},methods: {getShopData() {getShopList().then((res) => {this.listData = res.data.list.data;// 渲染完数据后将页面滚动到目标位置uni.getStorage({key: 'newsTop',success: (res) => {console.log(res);if (res.data) {uni.pageScrollTo({scrollTop: res.data,duration: 0,});}},});}).finally(() => {});},editShop(storeId = '') {//跳转详情页时将最后的滚动距离存到缓存中uni.setStorage({key: 'newsTop',data: this.scrollTop,});uni.navigateTo({url: '/pages/edit/shop/shop?store_id=' + storeId,});},},
};
</script>

相关文章:

  • Spring Boot微服务架构(八):开发之初就引入APM工具监控
  • 端口映射不通的原因有哪些?路由器设置后公网访问本地内网失败分析
  • uniapp-商城-73-shop(6-商品列表,步进器添加数据到购物车,步进器数据同步(深度监听))
  • jenkins部署slave动态节点
  • Metasploit工具使用详解(中)笔记
  • STM32 ADC工作原理与配置详解
  • 《棒球百科》NCAA棒球体系·棒球1号位
  • 使用LangChain与多模态模型实现图像中的文字和表格提取(PDF可转图片)
  • Vue 项目中 Sass 与 Less 的对比
  • docker 网络-用户定义网络
  • Vue内置指令与自定义指令
  • 深入理解SQLMesh中的Lookback、Forward-Only和Auto-Restatement特性
  • IBM DB2和MYSQL在安全性、稳定性等方面的差异
  • linux中基础IO(上)
  • 【halcon】像素维度:插值算法对图片的影响
  • linux打印项目文件夹结构的命令
  • 【机器学习基础】机器学习入门核心算法:朴素贝叶斯(Naive Bayes)
  • [CARLA系列--03]如何打包生成CARLA 0.9.15的非编辑版(地图的加载与卸载)
  • Docker-compose 编排lnmp(dockerfile) 完成Wordpress
  • 【AI学习笔记】Coze平台实现生成小红书热门多图笔记
  • 网站建设怎么加音乐/域名注册服务商
  • wordpress主题超2m/seo引擎搜索网站
  • 公司网站维护是做什么的/企业管理培训课程视频
  • 网站建设公司西安/关键词百度网盘
  • 青岛建设官方网站/正规微商免费推广软件
  • 宠物商店的网站开发论文/网络游戏推广员