怎样在微信小程序里实现分享页面后返回首页的功能

这次给大家带来怎样在微信小程序里实现分享页面后返回首页的功能,在微信小程序里实现分享页面后返回首页的功能的注意事项有哪些,下面就是实战案例,一起来看一下。

做小程序开发发现,页面分享出去后,用户通过分享进去的页面很难找到返首页的情况。(微信官方操作是点击右上角三个点,在手机下方显示返回首页)。民间很多方案是自己在页面加个悬浮Home标注。

今天我分享另外一种方法。请看下面.gif;

怎样在微信小程序里实现分享页面后返回首页的功能

有没有发现,左上角有返回按钮了。原理简单,在你要分享的页面,分享配置时配置你的首页,并带上对应的参数,在首页 onLoad方法中可以获取。代码如下:

我是首页 const app = getApp()Page({ data: {  motto: 'Hello World',  userInfo: {},  hasUserInfo: false,  canIUse: wx.canIUse('button.open-type.getUserInfo') }, //事件处理函数 goLogs: function() {  wx.navigateTo({   url: '/pages/logs/logs'  }) }, onLoad: function (options) {  console.log(options)  if (options.share_query){   wx.showLoading({    title: '我是从分享页面进入的',   })   setTimeout(function () {    wx.hideLoading()    wx.navigateTo({     url: '/pages/logs/logs',    })   }, 2000)    }  } })   {{index + 1}}. {{log}} const app = getApp()Page({ data: {  motto: 'Hello World',  userInfo: {},  hasUserInfo: false,  canIUse: wx.canIUse('button.open-type.getUserInfo') }, //事件处理函数 goLogs: function() {  wx.navigateTo({   url: '/pages/logs/logs'  }) }, onLoad: function (options) {  console.log(options)  //判断是否分享进入  if (options.share_query){   wx.showLoading({    title: '我是从分享页面进入的',   })   setTimeout(function () {    wx.hideLoading()    wx.navigateTo({     url: '/pages/logs/logs',    })   }, 2000)    }  } })

登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

如何使用Vue数据监听方法watch

如何利用JS分时函数进行性能优化

以上就是怎样在微信小程序里实现分享页面后返回首页的功能的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2756442.html

(0)
上一篇 2025年3月8日 07:38:48
下一篇 2025年3月7日 19:23:27

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 怎样处理vue页面加载闪烁

    这次给大家带来怎样处理vue页面加载闪烁,处理vue页面加载闪烁的注意事项有哪些,下面就是实战案例,一起来看一下。 v-if 和 v-show 的区别 v-if只会在满足条件时才会编译,而v-show不管是否满足条件始终会编译,v-show…

    编程技术 2025年3月8日
    200
  • Vue+BubbleTransition轻松实现页面切换效果

    这次给大家带来Vue+BubbleTransition轻松实现页面切换效果,Vue+BubbleTransition实现页面切换效果的注意事项有哪些,下面就是实战案例,一起来看一下。   CodePen 地址 前端使用 SPA 之后,能获得…

    2025年3月8日
    200
  • 微信小程序wx:for和wx:for-item的用法详解

    这篇文章主要介绍了微信小程序wx:for和wx:for-item的正确用法,wx:for是循环数组,wx:for-item即给列表赋别名,文中给大家列出来几个错误用法,大家一起学习下 wx:for=”{{list}}&#8221…

    编程技术 2025年3月8日
    200
  • 微信小程序block的使用教程

    这篇文章主要介绍了微信小程序block的使用 ,微信小程序最近非常火热,实现起来也很简单,只要block就可以实现,需要的朋友可以参考下 经过一年的发展,微信小程序发展火热,本期就介绍下小程序的一些使用。 在安卓中我们经常会使用ListVi…

    2025年3月8日
    200
  • 微信小程序实现全局搜索代码高亮的示例

    本篇文章主要介绍了微信小程序实现全局搜索代码高亮的示例,现在分享给大家,也给大家做个参考。 需求 最近在做微信小程序的时候,需要实现在搜索框的输入内容的时候实现全局匹配实现高亮效果,目前的思路是,递归后台来返回的数据,并将对象的value值…

    编程技术 2025年3月8日
    200
  • 怎样用mpvue构建小程序

    这次给大家带来怎样用mpvue构建小程序,用mpvue构建小程序的注意事项有哪些,下面就是实战案例,一起来看一下。 mpvue是一个使用Vue.js开发小程序的前端框架(美团的开源项目)。框架基于Vue.js核心,mpvue修改了Vue.j…

    2025年3月8日
    200
  • 怎样进行mpvue小程序项目搭建

    这次给大家带来怎样进行mpvue小程序项目搭建,进行mpvue小程序项目搭建的注意事项有哪些,下面就是实战案例,一起来看一下。 前言 mpvue 是美团开源的一套语法与vue.js一致的、快速开发小程序的前端框架,按官网说可以达到小程序与H…

    2025年3月8日
    200
  • 怎样实现Vue页面骨架屏

    这次给大家带来怎样实现Vue页面骨架屏,实现Vue页面骨架屏的注意事项有哪些,下面就是实战案例,一起来看一下。 在开发webapp的时候总是会受到首屏加载时间过长的影响,主流的解决方法是在载入完成之前显示loading图效果,而一些大公司会…

    2025年3月8日
    200
  • 如何使用vue配置多页面

    这次给大家带来如何使用vue配置多页面,使用vue配置多页面的注意事项有哪些,下面就是实战案例,一起来看一下。 1.安装环境 ①安装node.js 并添加入环境变量PATH ②安装淘宝NPM镜像 $ npm install -g cnpm …

    2025年3月8日
    200
  • 怎样使vue项目刷新页面

    这次给大家带来怎样使vue项目刷新页面,使vue项目刷新页面的注意事项有哪些,下面就是实战案例,一起来看一下。 1.场景 在处理列表时,常常有删除一条数据或者新增数据之后需要重新刷新当前页面的需求。 2.遇到的问题 1. 用vue-rout…

    2025年3月8日
    200

发表回复

登录后才能评论