微信小程序：实现悬浮返回和分享按钮

微信为小程序提供客服消息能力,小程序用户可以方便快捷地与小程序服务提供方进行沟通,并且已经做成了组件的形式,直接就可以调用.客服会话按钮,用于在页面上显示一个客服会话按钮,用户点击该按钮后会进入客服会话.那么如何自定义成悬浮客服会话按钮呢?随Z5Win一起来看看 1.我们可以定义contact-button的样式,加一个class.这个客服组件可以放在一个固定模板里,方便每个页面都调用到. <view> <contact-button class="img-plus-style

问题场景 所谓悬浮窗就是图中微信图标的按钮,采用fixed定位,可拖动和点击. 这算是一个比较常见的实现场景了. 为什么要用cover-view做悬浮窗?原生组件出来背锅了~ 最初我做悬浮窗用的不是cover-view,而是view. 这是简化的代码结构: index.wxml: <view class="move-view" style=" top:{{top}}px;left:{{left}}px;" bindtap="goToHome"

微信小程序在12月21日发布了新版本的开发工具,并在官网公布新增分享.模板消息.客服消息.扫一扫.带参数二维码功能. 有了分享功能,相信会给很多创业者带来了无限的可能性! 下面就来看看这些新功能到底怎么用吧! 1.分享 可以分享小程序的任何一个页面给好友或群聊.注意是分享给好友或群聊,并没有分享到朋友圈.一方面微信在尝试流量分发方式,但同时又不愿意开放最大的流量入口. 开发文档:https://mp.weixin.qq.com/debug/wxadoc/dev/api/share.html?t=

前言: 小程序开发中诸如获取用户手机号码.调起微信支付.领取卡券等api都是会有一定的延迟的.也就是说通过点击按钮调用这些api的时候,从点击按钮调用api,到支付页面或者领取卡券界面展示出来是需要一定时间的,连续点击按钮,还是有可能会重复调用的. 虽然这种情况有点极端,正常用户是不会这么连续快速的点击按钮的,但是也不能排除有用户手抖,连续点了两下.如果重复调用的话,不仅体验不好,单击事件中涉及到后端接口操作的也可能引起其他异常.所以这个问题还是要处理下的. 刚开始想到的是使用loading开启

前言 因产品需求,需要在小程序中生成一张分享海报用于产品推广.特此记录一波产出过程~ 这次开发使用的是  uni-app 来产出小程序 Part.1  大致思路 按照设计图将所需元素全部画入 Canvas 画布,再利用 wx.canvasToTempFilePath(Object object, Object this)  API 将 Canvas 生成一张指定大小的图片,保存分享即可~ 此API具体用法和注意事项可去 https://developers.weixin.qq.com/minip

今天根据网上的教程搭建了微信小程序的环境,然后看文档做了一个简单的小应用. 项目的目录是这个样子的: app.js.app.json.app.wxss是全局文件,必不可少的文件.定义在app.wxss中的样式为全局样式,作用于每一个页面.在page的wxss文件中定义的样式为局部样式,只作用在对应的页面,并会覆盖app.wxss中相同的选择器. app.js文件代码: App({ onLaunch: function () { console.log('小程序已启动') }, onShow: f

描述:有三个页面,第一个页面wx.navigateTo到第二个页面,第二个页面跳转到第三个页面,第三个页面不能有返回键,第三个页面提交返回第二个页面,第二个页面可以按返回键返回第一个页面 问题:使用了wx.redirectTo,但发现第三个页面的返回按钮存在,经过查阅发现是因为上一个页面是 使用wx.navigateTo从第一个页面跳转而来,所以使用wx.redirectTo从第二个页面跳转到第三个页面以后第三个页面有返回按钮. 解决办法:使用第二个页面到第三个页面的跳转使用wx.reLaunc

例如在index首页增加客服代码及一键拨打电话 1.index.wxss或者app.wxss文件里增加样式 .img-plus-style { height: 70rpx; width: 70rpx; position: fixed; bottom: 220rpx; right: 30rpx; opacity: 0.7 } .img-plus-style1 { height: 70rpx; width: 70rpx; position: fixed; bottom: 130rpx; right:

解决方法有两种: 1.把该页面设置为tab页面或者主页 ; 2.进入该页面使用 wx.reLaunch(); 示例 wx.reLaunch({url: '../detail/detail',}) 这样有一个弊端,就是会销毁其它所有的页面. 原文地址:http://blog.51cto.com/13507333/2151868