他的最新文章
他的热门文章
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)解决wx.onMenuShareTimeline出现的问题
作者：zhouyu
字体：[ ] 类型：转载 时间：
本文主要介绍解决wx.onMenuShareTimeline出现的问题，这里提供了示例代码作为参考，有需要的小伙伴可以参考下
wx.onMenuShareTimeline使用注意事项
我在开发测试过程中,发现使用wx.onMenuShareTimeline无效果,没有显示我定义的图片、title和链接,经过调试发现原因如下：
1.图片大小要大于300pix才能显示
2.这个方法必须先config成功，然后再wx.ready里才能调用。我直接放到$(function(){})里执行，实践证明是不行的。
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '{$appid}', // 必填，公众号的唯一标识
timestamp: "{$signPackage.timestamp}", // 必填，生成签名的时间戳
nonceStr: '{$signPackage.nonceStr}', // 必填，生成签名的随机串
signature: '{$signPackage.signature}',// 必填，签名，见附录1
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo'
] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
wx.ready(function () {
wx.onMenuShareTimeline({
title: '--{$info.name}', // 分享标题
link: '{$url}__URL__/index?pid={$pid}&puid={$uid}', // 分享链接,将当前登录用户转为puid,以便于发展下线
imgUrl: '{$url}__PUBLIC__/Uploads/{$goodsvo.image}', // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
alert('分享成功');
cancel: function () {
// 用户取消分享后执行的回调函数
wx.error(function(res){
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
alert("errorMSG:"+res);
通过此文希望能帮助遇到同样情况的朋友，谢谢大家对本站的支持！
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具还没有任何记录...
http://www.51xuediannao.com/plus/count1.php?view=yes&aid=1128&mid=1
微信小程序路由跳转指定页面
作者： 懒人建站
微信小程序路由跳转，共有三种形式，页面中使用navigator组件做路由跳转，js中可以使用wx.navigateTo--保留当前页面，跳转到应用内的某个页面，wx.redirectTo--关闭当前页面，跳转到应用内的
微信小程序路由跳转，共有三种形式，页面中使用navigator组件做页面链接形式路由跳转，js中可以使用wx.navigateTo--保留当前页面，跳转到应用内的某个页面，wx.redirectTo--关闭当前页面，跳转到应用内的某个页面&wx.navigateBack()--关闭当前页面，回退前一页面。
页面链接。
应用内的跳转链接
是否关闭当前页面
hover-class
navigator-hover
指定点击时的样式类，当hover-class=&none&时，没有点击态效果
注：navigator-hover默认为{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;},&&navigator/&的子节点背景色应为透明色
示例代码：
/** wxss **/
/** 修改默认的navigator点击态 **/
.navigator-hover {
/** 自定义其他点击态样式类 **/
.other-navigator-hover {
&!-- sample.wxml --&
&view class=&btn-area&&
&navigator url=&navigate?title=navigate& hover-class=&navigator-hover&&跳转到新页面&/navigator&
&navigator url=&redirect?title=redirect& redirect hover-class=&other-navigator-hover&&在当前页打开(关闭了当前页面)&/navigator&
&!-- navigator.wxml --&
&view style=&text-align:center&& {{title}} &/view&
&view& 点击左上角返回回到之前页面 &/view&
&!-- redirect.wxml --&
&view style=&text-align:center&& {{title}} &/view&
&view& 点击左上角返回回到上级页面 &/view&
// redirect.js navigator.js
onLoad: function(options) {
this.setData({
title: options.title
保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页面。
OBJECT参数说明：
需要跳转的应用内页面的路径
接口调用成功的回调函数
接口调用失败的回调函数
接口调用结束的回调函数（调用成功、失败都会执行）
示例代码：
wx.navigateTo({
url: 'test?id=1'
注意：为了不让用户在使用小程序时造成困扰，我们规定页面路径只能是五层，请尽量避免多层级的交互方式。
wx.redirectTo(OBJECT)
关闭当前页面，跳转到应用内的某个页面。
OBJECT参数说明：
需要跳转的应用内页面的路径
接口调用成功的回调函数
接口调用失败的回调函数
接口调用结束的回调函数（调用成功、失败都会执行）
示例代码：
wx.redirectTo({
url: 'test?id=1'
关闭当前页面，回退前一页面。
本文链接：http://www.51xuediannao.com/xiaochengxu/xiaochengxu_luyou.html
微信小程序路由跳转指定页面由懒人建站收集整理，您可以自由传播，请主动带上本文链接
就是免费分享，觉得有用就多来支持一下，没有能帮到您，懒人也只能表示遗憾，希望有一天能帮到您。
(责任编辑：懒人建站)
微信小程序路由跳转指定页面-相关文章他的最新文章
他的热门文章
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)微信小程序开发总结 - 简书
微信小程序开发总结
最近做了一个投票的微信小程序，开发过程主要还是参考官方文档： 由于一直是做 Android 开发的，所以写小程序界面时还需要大概看一下前端的东西，对于这些东西微信自己也做了一些封装，但总体来说差别不大，这里进行一下总结。
注册并创建项目
进行注册，获取 AppID并在设置中进行一些配置（如服务器域名），下载小程序的开发工具，扫描二维码登陆，创建新项目。在创建项目时可以选择创建一个 quick start 项目，这样会自动生成一个简单的 demo，有助于我们了解项目的结构和组成。
但是请注意，坑爹的小程序是不支持个人用户注册的，所以如果不是公司项目，而只是个人想体验一下，要么在创建项目时选择无 AppID，但这样就只能在开发工具的模拟器上运行，不能在手机上运行也不能发布，要么参考
这篇文章钻个漏洞获取一个AppID，当然还是没办法发布，但至少能在手机上运行了。
小程序的框架分为视图层（View）和逻辑层（App Service），它提供了自己的视图层描述语言 WXML 和 WXSS，以及基于 JavaScript 的逻辑层框架，并在视图层与逻辑层间提供了数据传输和事件系统。
这里的 WXML 和 WXSS 类似于前端的 HTML 和 CSS，但是 WXML 只能使用微信自己定义的组件而不能使用 HTML 里面的标签，WXSS 则和 CSS 无太大差别。
框架的核心是一个响应的数据绑定系统，也就是说当做数据修改的时候，只需要在逻辑层修改数据，视图层就会做相应的更新。
上图是我做的投票小程序里面的代码结构：
1、一个小程序主体部分由 app.js、app.json、app.wxss 三个文件组成，必须放在项目的根目录，分别是整个程序的逻辑、全局配置及样式。
(1) app.js 是小程序的脚本代码。通过App()函数用来注册一个小程序，接受一个 Object 参数，指定小程序的生命周期函数等，如下图所示。
类似于 Android 中 的 Application，我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。
其他地方使用时通过var app = getApp()即可获取其实例，并调用其中定义的方法和变量，但不要调用生命周期的方法。在App()的外面还可以另外定义 function 和变量，但只能在本文件内使用。
(2) app.json 是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成，配置小程序的窗口背景色，配置导航条样式，配置默认标题。
pages 指定了小程序的组成页面，第一个代表小程序的初始页面。
window 用于设置小程序的状态栏、导航条、标题、窗口背景色。
tabBar 用于配置客户端窗口的底部或顶部 tab 栏的样式以及 tab 切换时显示的对应页面。
另外还可以配置各种网络请求的超时时间networkTimeout和是否开启调试模式debug。
(3) app.wxss 是整个小程序的公共样式表。可以配置一些通用的样式。
2、pages 里面则是小程序的各个页面，其中 index 一般作为主界面（当然这并不是由名字决定的，而是在app.json里面配置的第一个page），可以看到，一个界面由 wxml、wxss、js、json 等四个文件组成，分别是页面的逻辑、界面结构，样式以及配置。小程序规定这四个文件必须具有相同的路径和名字。
(1) js 是页面的脚本代码。通过Page()函数用来注册一个页面。接受一个 Object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等，如下图所示。
其中data定义了页面的初始数据，会以 JSON 的形式由逻辑层传至渲染层，所以其数据必须是可以转成 JSON 的格式：字符串，数字，布尔值，对象，数组。渲染层可以通过 WXML 对数据进行绑定。
onLoad、onShow、onReady、onHide、onUnload
是页面的生命周期函数，分别在页面加载、显示、初次渲染完成、隐藏和卸载时调用。其中onLoad和onReady只会在页面加载时调用一次，onShow则每次显示页面都会调用一次。
onPullDownRefresh用于监听用户下拉刷新事件，需要在 json 配置文件中开启enablePullDownRefresh。当处理完数据刷新后，wx.stopPullDownRefresh可以停止当前页面的下拉刷新。
onShareAppMessage只有定义了该方法才会在微信的右上角菜单显示分享按钮，需要 return 一个 Object，用于自定义分享内容，包括title标题和path分享的页面的完整路径。
viewTap是事件处理函数，函数名是自己取的，在渲染层可以在组件中加入事件绑定&view bindtap="viewTap"& click me &/view&，当达到触发事件时，就会执行 Page 中定义的事件处理函数。
当需要改变data中的数据时，不能直接修改this.data，而需要调用this.setData()方法进行修改。
在Page()的外面同样可以另外定义 function 和变量，也只能在本文件内使用。
(2) wxml 是页面的布局文件，只能使用微信自己定义的组件。 这里是微信提供的所有组件的列表和属性，其中使用得最多的是 view 以及一些表单组件如 button 等等。具体的布局方式跟HTML差不多，这里不再多说。
(3) wxss 是样式表，具有 CSS 大部分特性，并进行了特性扩展，主要包括：
① 尺寸单位：rpx（responsive pixel）可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。
② 样式导入：使用@import语句可以导入外联样式表，@import后跟需要导入的外联样式表的相对路径，用;表示语句结束。例如：
/** common.wxss **/
.small-p {
/** app.wxss **/
@import "common.wxss";
.middle-p {
padding:15
定义在 app.wxss 中的样式为全局样式，作用于每一个页面。在 page 的 wxss 文件中定义的样式为局部样式，只作用在对应的页面，并会覆盖 app.wxss 中相同的选择器。
(4) json 是页面的配置文件，页面的配置比app.json全局配置简单得多，只是设置 app.json 中的 window 配置项的内容，页面中配置项会覆盖 app.json 的 window 中相同的配置项，无需写 window 这个键。上面说的开启下拉刷新功能就需要在这个文件里面进行配置：
由于是 json 格式的文件，即使不需要配置任何东西也需要写{}，否则会报错。
3、utils 里面包含了一些将公共的代码抽离出来的 js 文件，作为一个模块可以方便被任何地方使用。模块只有通过 module.exports 才能对外暴露接口。下图即为utils/util.js文件中的内容，包含了一个formatDate的方法，并将方法 exports 给外部使用。
在其他地方使用时需要通过var utils = require('../../utils/util.js');进行引用，之后就可以通过变量 utils 调用 util.js 文件中定义的方法。
4、images 里面则放了一些图片资源。
WXML 中的动态数据均来自对应 Page 的 data。数据绑定使用双大括号将变量包起来，可以作用于内容、组件属性(需要在双引号之内)、控制属性(需要在双引号之内)、关键字(需要在双引号之内)。
message: "Hello",
condition: true
&view& {{message}} &/view&
&view id="item-{{id}}"& &/view&
&view wx:if="{{condition}}"& &/view&
&checkbox checked="{{condition}}"& &/checkbox&
还可以在 {{}} 内进行简单的运算，如：
flag: true,
length: 6,
name: 'MINA',
key: 'Hello '
array: ['MINA']
&view hidden="{{flag ? true : false}}"& Hidden &/view&
&view& {{a + b}} + {{c}} + d &/view& // 结果为3 + 3 + d
&view wx:if="{{length & 5}}"& &/view&
&view&{{"hello" + name}}&/view&
&view&{{object.key}} {{array[0]}}&/view&
在框架中，我们用 wx:if="{{condition}}" 来判断是否需要渲染该代码块：
&view wx:if="{{condition}}"& True &/view&
也可以用 wx:elif 和 wx:else 来添加一个 else 块：
&view wx:if="{{length & 5}}"& 1 &/view&
&view wx:elif="{{length & 2}}"& 2 &/view&
&view wx:else& 3 &/view&
因为 wx:if 是一个控制属性，需要将它添加到一个标签上。但是如果我们想一次性判断多个组件标签，我们可以使用一个 &block/& 标签将多个组件包装起来，并在上边使用 wx:if 控制属性。
&block wx:if="{{true}}"&
&view& view1 &/view&
&view& view2 &/view&
注意： &block/& 并不是一个组件，它仅仅是一个包装元素，不会在页面中做任何渲染，只接受控制属性。
一般来说，wx:if 有更高的切换消耗而 hidden 有更高的初始渲染消耗。因此，如果需要频繁切换的情景下，用 hidden 更好，如果在运行时条件不大可能改变则 wx:if 较好。
在组件上使用wx:for控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。
默认数组的当前项的下标变量名默认为index，数组当前项的变量名默认为item
&view wx:for="{{array}}"&
{{index}}: {{item.message}}
message: 'foo',
message: 'bar'
使用 wx:for-item 可以指定数组当前元素的变量名，使用 wx:for-index 可以指定数组当前下标的变量名：
&view wx:for="{{array}}" wx:for-index="idx" wx:for-item="itemName"&
{{idx}}: {{itemName.message}}
wx:for也可以嵌套，下边是一个九九乘法表
&view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="i"&
&view wx:for="{{[1, 2, 3, 4, 5, 6, 7, 8, 9]}}" wx:for-item="j"&
&view wx:if="{{i &= j}}"&
{{i}} * {{j}} = {{i * j}}
类似block wx:if，也可以将wx:for用在&block/&标签上，以渲染一个包含多节点的结构块。例如：
&block wx:for="{{[1, 2, 3]}}"&
&view& {{index}}: &/view&
&view& {{item}} &/view&
如果列表中项目的位置会动态改变或者有新的项目添加到列表中，并且希望列表中的项目保持自己的特征和状态（如 &input/& 中的输入内容，&switch/& 的选中状态），需要使用 wx:key 来指定列表中项目的唯一的标识符。wx:key 的值以两种形式提供：
① 字符串，代表在 for 循环的 array 中 item 的某个 property，该 property 的值需要是列表中唯一的字符串或数字，且不能动态改变。
② 保留关键字 *this 代表在 for 循环中的 item 本身，这种表示需要 item 本身是一个唯一的字符串或者数字。
objectArray: [
{id: 0, unique: 'unique_0'},
{id: 1, unique: 'unique_1'},
{id: 2, unique: 'unique_2'},
numberArray: [1, 2, 3, 4]
&switch wx:for="{{objectArray}}" wx:key="unique" style="display:"& {{item.id}} &/switch&
&switch wx:for="{{numberArray}}" wx:key="*this" style="display:"& {{item}} &/switch&
上面简单提到过 &view& 的事件绑定，通常在组件中绑定一个事件处理函数，在相应的Page定义中写上相应的事件处理函数，参数是event。
事件分为冒泡事件（当一个组件上的事件被触发后，该事件会向父节点传递）和非冒泡事件（当一个组件上的事件被触发后，该事件不会向父节点传递）。
冒泡事件有：touchstart（手指触摸动作开始）、touchmove（手指触摸后移动）、touchcancel（手指触摸动作被打断，如来电提醒，弹窗）、touchend（手指触摸动作结束）、tap（手指触摸后马上离开）、longtap（手指触摸后，超过350ms再离开）。
除此之外其他组件自定义事件如无特殊申明都是非冒泡事件，如&form/&的submit事件，&input/&的input事件，&scroll-view/&的scroll事件。
事件绑定的写法同组件的属性，以 key、value 的形式。key 以 bind 或 catch 开头事件的类型结尾，如bindtap, catchtouchstart，value 是一个字符串，需要在对应的 Page 中定义同名的函数。
bind 事件绑定不会阻止冒泡事件向上冒泡，catch 事件绑定可以阻止冒泡事件向上冒泡。
当组件触发事件时，逻辑层绑定该事件的处理函数会收到一个事件对象。
BaseEvent 基础事件对象的属性包括type（事件类型）、timeStamp（事件生成时的时间戳）、target（触发事件的组件的一些属性值集合）、currentTarget（当前组件的一些属性值集合）。
CustomEvent 自定义事件对象继承自BaseEvent，并增加了 detail（额外的信息） 属性。
TouchEvent 触摸事件对象继承自BaseEvent，并增加了 touches（触摸事件，当前停留在屏幕中的触摸点信息的数组）和 changedTouches（触摸事件，当前变化的触摸点信息的数组） 属性。
dataset 在组件中可以定义数据，以data-开头，多个单词由连字符-连接，不能有大写(大写会自动转成小写) 如data-element-type，最终在 event.target.dataset 中会将连字符转成驼峰elementType。
小程序的登录流程如下图所示：
以下是我的登陆方法，放在 util.js 中，并传入了一个 function 的参数 cb 作为登陆成功时的回调。如果不需要回调则不传即可。通常会在程序启动时调用一次（可以在 app.js 的 onLaunch 中，也可以在 index.js 的onLoad 中），之后在任何请求中碰到 access_token 过期或无效时再调用。
function login(cb) {
wx.login({
success: function (res) {
var code = res.
if (code) {
wx.getUserInfo({
success: function (res) {
var userInfo = res.userI
wx.setStorageSync('user', userInfo);
wx.request({
url: 'https://server-host/login',
data: { 'code': code, 'user_info': userInfo },
method: 'POST',
success: function (res) {
if (res.data.data && res.data.data.access_token) {
wx.setStorageSync('accessToken', res.data.data.access_token);
typeof cb == 'function' && cb();
showFailedToast('服务器登陆失败，请退出后重新登录');
fail: function (e) {
showFailedToast('服务器登陆失败，请退出后重新登录');
fail: function (e) {
showFailedToast('获取用户信息失败，请退出后重新登录');
showFailedToast('获取微信登录状态失败，请退出后重新登录');
fail: function (e) {
showFailedToast('微信登陆失败，请退出后重新登录');
1、微信小程序需要调用 wx.login() 进行登录，成功后会返回一个 code。
2、通过 wx.getUserInfo() 获取用户信息，虽然这个 API 不需要用到 code，但也只能在 wx.login 成功后才能调用。获取 userInfo 后，可以通过 wx.setStorageSync() 将用户信息保存到本地缓存中。
3、通过 wx.request() 请求服务器的登录api，将 code 和 userInfo 传过去，服务器会生成一个access_token（即上图中的3rd_session，命名可以按照各自的习惯） 返回，之后通过 wx.setStorageSync() 将这个 access_token 保存到本地缓存中。
4、之后在任何地方进行请求服务器的操作，都可以通过 wx.getStorageSync() 将本地保存的 access_token 取出来并作为参数带上。
5、由于 access_token 存在过期的问题，因此可以与服务器约定一个特殊的 sta，比如 -500，作为 access_token 过期的标识，在任何请求中，碰到返回的 sta 为 -500 时，就可以重新调用 login 方法，传入一个登陆成功后的回调 function 作为参数，获取新的 access_token 保存，并在登陆成功后的回调 function 中再次发送请求。代码如下：
function loadDetail(self) {
wx.request({
url: 'https://server-host/detail',
data: { 'vid': self.data.vid, 'access_token': wx.getStorageSync('accessToken') },
method: 'GET',
success: function (res) {
if (res.data.sta == -500) {
utils.login(function () {
loadDetail(self);
fail: function () {
以上登陆过程中提到了几个比较常用的微信API，如 wx.login()、wx.getUserInfo()、wx.setStorageSync()、wx.getStorageSync()、wx.request() 等，另外还有很多的API，在
中写的很清楚，这里就不一一说明了，大家用的时候查看一下文档即可。
提纲: 小程序: 个人内容总结: 微信公众号: 在2012年微信公众号开始出现并上线,起初定位为[微信公众平台]简称公众号。曾命名为“官号平台”、“媒体平台”、微信公众号，最终定位为“公众平台&; 在2012年开始到现在中间发展的几年,相信每个公司都会有自己的微信公众号,渐...
微信小程序在无论在功能、文档及相关支持方面，都是优于前面几种微信账号类型，它提供了很多原生程序才有的接口，使得我们的小程序在很多方面突破H5页面应用的限制，更加接近原生程序的功能，因此微信小程序具有很大的前景想象力。它提供了自己的视图层描述语言WXML和WXSS，以及基于J...
最近公司需要一个微信小程序demo去给客户看，就研究了几天。 下面就说说开发微信小程序的时候遇到的一些问题，对于小程序的开发教程就不细说了，很多人都写的比我好。下面就说一些我个人觉得比较实用的。 快速创建页面 刚开始开发小程序的时候，一个个创建对应页面的js、json、 w...
微信小程序在无论在功能、文档及相关支持方面，都是优于前面几种微信账号类型，它提供了很多原生程序才有的接口，使得我们的小程序在很多方面突破H5页面应用的限制，更加接近原生程序的功能，因此微信小程序具有很大的前景想象力。它提供了自己的视图层描述语言 WXML 和 WXSS，以及...
转载请注明出处, 谢谢! (～ o ～)Y 1月9日，也就是今天，微信推出的“小程序”正式上线。“小程序”是一种无需安装，即可使用的手机“应用”。不需要像往常一样下载App，用户在微信中“用完即走”。目前，东方航空公司、美团大众点评、京东、新华社、今日头条、滴滴出行、摩拜单...
在小区对面开了一家面包店，每次路过蛋糕店都排了满满的人，听老妈说这家店有一个肉松小贝特别好吃，可惜每次路过都排着长队，虽然就开在家门口，但很少有机会买到。 想起以前在帝都吃的肉松小贝，也是排着长长的对买来，不会像别的面包一样太干，也不像蛋糕那么油腻，松软可口的蛋糕配上松香咸...
闷热了足足半月有余，期待着下一场雨降降温，可是老天总是淘气，把冰雹下到了隔壁的东京，我这里的天空滴了几滴雨后就停止了美好，朋友圈各种刷屏，不转不是留学生系列再现江湖，你们真是闲的呀，知道我多羡慕吗？这会是晚上19:45分，温度27度，关掉空调后房间稍微有点热，待会继续打开睡...
《毅力：如何培养自律的习惯》作者：吉姆.兰德尔 我的五个小目标 1. 半年内，彻底实现由国际业务到公司业务的转变 具体步骤：首先进行公司信贷理论学习，用理论来指导实践，先考取公司信贷从业资格证书，已完成。其次，研究精通《贷款通则》，购买一些公司信贷实务的相关书籍。再次，从初...
三年离殇清明断魂，百花丛中小小墓前，俊朗消瘦的白衣男子凝视着石碑上清秀温婉的女子照片，倘然若失恍若隔世… 你总是说我记性不好，答应你的事总会很快忘掉其实答应你的每一件事我都刻在心底佯装不记得只是想看你生气时嘟嘴的可爱模样… 亲爱的答应你不再吸烟，我有做到，现在我们的家中再也...
mark一下小温暖~ 1.跟同事好朋友一起加班...彼此鼓励着 她播放着五月天的“倔强”跟我说：不能绝望 不能妥协... 2.昨天看了一本治愈型漫画，很温暖，很性感超解压... #百日生涯营# 18/100 【日常】 昨日入睡时间：23:15 今日起床时间：5:30 锻炼一...