微信应用号，小程序开发教程第三弹

雷锋网按：本文作者博卡君，一名程序猿。雷锋网已获作者授权发布。未经授权拒绝转载！本文是微信小程序开发教程系列第三篇， 读本文之前可以先看看这两篇：重磅 | 微信应用号，小程序最新开发教程微信应用号，小程序最新开发教程第二弹感谢朋友们的支持！这两天博卡君收到了很多支持和安慰，也认识了很多志同道合的朋友。目前微信公布的工具和代码都不是正式版，随时有可能调整，大家先体验和学习为主吧。最近这个教程搞得我也心力交瘁了，虽然苦逼，但很开心。第五章：微信小程序名片夹详情页开发今天的内容加了新干货！除了开发日志本身，还回答了一些朋友的问题。闲话不多说，先看下名片盒详情页的效果图： 备注下大致需求：顶部背后是轮播图，二维码按钮弹出模态框信息、点击微信栏、点击存入手机，地址栏需要地图展示，名片分享也是模态框指引。首先是轮播图，autoplay 自动播放，interval 轮播的时间，duration 切换速度，可以根据自己需求去添加。Delete：是删除按钮，加载进来是隐藏的，需用户点轮播图进去后，轮播图全屏显示才出来。noClickImg 与 ClickImg：切换全屏与非全屏轮播图，绑定了点击事件 changeClick 来切换，只是改变样式即可。Block：图片列表。Number_img：当前轮播 index（currentNumber），与图片 length 集合（cardnum）。其中 currentNumber：//轮播图发生改变时改变数字//初始化数据Data:{currentNumber:1}         slidechange:function(e){                   var number = e.detail.current;                   this.setData({                            currentNumber:number+1                   })         },这里可以看到全屏状态下当关闭按钮被点击后 getBackStyle，把 changeClick 切换到 imgFullScrenn 待命。  再次点击返回原样式，，切换后事件又走回到 getBackStyle 了，灵活运用。 刷新下开发者工具可以看到具体效果如下： 详情页可以看到信息基本都是样式一样，可以使用微信提供的循环block。下面是详情页里面的个人信息数据，如果有信息就显示出来，没有数据的不显示，这里使用 //中文信息var chinaMessage = res.card.groups[0].fields;var personMessage= []for(var i = 0;i

版权声明： 创新中心创新赋能平台中，除来源为“创新中心”的文章外，其余转载文章均来自所标注的来源方，版权归原作者或来源方所有，且已获得相关授权，若作者版权声明的或文章从其它站转载而附带有原所有站的版权声明者，其版权归属以附带声明为准。其他任何单位或个人转载本网站发表及转载的文章，均需经原作者同意。如果您发现本平台中有涉嫌侵权的内容，可填写「投诉表单」进行举报，一经查实，本平台将立刻删除涉嫌侵权内容。