周大生：1-2月净利润约2.18亿元，同比增长36%
06-18
雷锋网出版社：这篇文章是关于程序员作者博卡君的。
雷锋网已获得作者授权发布。
未经授权禁止转载！本文是微信小程序开发教程系列的第三篇。
在阅读本文之前，你可以先阅读这两篇文章：重磅|微信应用号，最新小程序开发教程 微信应用号，最新小程序开发教程第二期。
谢谢朋友们。
支持！这两天博卡君得到了很多支持和安慰，结交了很多志同道合的朋友。
目前微信发布的工具和代码还不是正式版本，可能随时进行调整。
每个人都应该先去体验、去学习。
最近这个教程让我身心俱疲。
虽然很辛苦，但是我很开心。
第五章：微信小程序名片夹详情页开发今天的内容又增加了新信息！除了开发日志本身之外，我还回答了一些朋友的问题。
废话不多说，我们看一下名片盒子详情页的效果图：注意一下大致需求：顶部后面是轮播图，二维码按钮弹出模态盒子信息，点击微信栏，点击保存到手机，需要地址栏 地图显示、名片分享也是模态框指引。
首先是轮播图片，autoplay自动播放，间隔轮播时间，时长切换速度，可以根据自己的需要添加。
Delete：这是一个删除按钮。
加载后隐藏。
用户需要点击轮播图进入，然后轮播图就会全屏显示。
noClickImg 和 ClickImg：在全屏和非全屏轮播图像之间切换。
点击事件changeClick绑定切换。
只是改变风格。
块：图片列表。
Number_img：当前轮播索引（currentNumber），以及图像长度设置（cardnum）。
其中，currentNumber: //轮播图变化时改变数字 //初始化数据 Data:{currentNumber:1} slipchange:function(e){ var number = e.detail.current; this.setData({ currentNumber:number }) }, 这里可以看到全屏状态下点击关闭按钮时，getBackStyle将changeClick切换为imgFullScrenn，处于待机状态。
再次单击可返回原始样式。
切换后，事件返回getBackStyle。
灵活运用吧。
刷新开发者工具后，可以看到具体效果如下： 在详情页，可以看到信息风格基本一致，可以使用微信提供的循环块。
以下是详情页中的个人信息数据。
如果有信息就会显示。
如果没有数据，则不会显示。
//这里使用中文信息。
var chinaMessage = res.card.groups[0].fields;var personMessage= []for( var i = 0;i 我们需要做的就是将显示值绑定到它上面，然后我们就可以调用它了。 这个版本的微信的setData不支持数据的异步更新，所以当真正的网络数据请求发生时，我们必须在最后添加forceUpdata()来强制视图渲染，否则会出现很多莫名其妙的bug。 这里解释一下：这是服务器的真实数据。 可以看到会报错。 可能是js的执行顺序。 一一往下走。 此时仍在请求网络数据。 只需定义一个变量即可。 当然，这里的数据都是推上去的。 以下是二维码弹出消息。 这是弹出的模态框的二维码信息。 布局初始化处于none状态。 需要直接绑定数据： this.setData({ //模态框名称: "显示?隐藏"}) 方法就是让它显示。 只需在需要的地方调用该方法即可。 （支持重复调用）详情页的公司位置图直接调用微信提供的接口（群里的demo有实现方法）。 可以看到实现的效果：下一章：微信（小程序）我的页面开发。 第六章：我的页面开发效果图以及微信小程序的需求：用户有多张名片，需要左右切换查看。 向下切换是菜单按钮。 这里我们需要在两个地方滑动。 我们使用微信提供的滑动组件swiper，并以嵌套的方式使用。 第一层是名片展示和菜单按钮的上下滑动。 第二层是名片展示的左右滑动（支持相互嵌入，可以成套使用，放心使用）。 添加Vertical表示垂直滑动，去掉Vertical表示左右滑动。 整体结构如下： 由于需要支持多次点击切换，因此点击事件与数据切换方法绑定。 初始化数据为nextSlide：再看nextSlide事件。 currentSlide 是当前页面的索引。 改变它就可以完成切换效果。 上图中可以看到，初始化数据时cs被设置为0。 因此，只需赋值当前的data.cs，然后将绑定的点击事件clickNext切换为nextSlideAgain即可。 我们再看一下 nextSlideAgain 事件。 执行减去1索引，达到多次点击的切换效果。 具体效果可见一斑。 点击个人名片，进入编辑名片页面。 由于需要参数，所以使用wx.navgateTo。 大家可以看看效果： 最后，一些有用的信息：我们发出第一个教程时有人注意到了这一点。 如何进行真正的数据交互，大家可以在下面了解一下。 首先进入的是MD5加密和请求者交互层。 如何引用MD5.js？当然是模块化的require，别忘了module.exports引用的js。 下面是引用 MD5.js 的 requester.js。 ApplicationRoot为服务器地址（配置服务器时查看开发设置页面的AppID和AppSecret，并配置服务器域名）。 Require.js module.exports 这里暴露了方法。 此时全局app.js中引入了require.js，并映射到全局global。 这个全球性就是全球性。 这时候如果那个页面需要那个页面的话，直接接受就可以了。 模块化很有用吗？可以完整的看一下一个request与后台进行数据交互的实现，如下：图1是requester.js中的封装。 图2展示了需要调用数据的页面渲染。 如果您有任何疑问，请告诉我。 一些已知的问题将在下一章中解释。 应该有人喜欢sublime编辑器。 有人问如何切换高亮。 只需切换到页面右下角的 html 即可。 下一章：微信小程序编辑名片页面开发（涉及要点：检索、排序、滑动和页面交互）。 相关阅读：不要高估微信小程序，也不要低估百度91的销量。 翻遍“微信小程序”知乎问答，整理了这篇文章。
版权声明：本文内容由互联网用户自发贡献，本站不拥有所有权，不承担相关法律责任。如果发现本站有涉嫌抄袭的内容，欢迎发送邮件 举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。
标签：
相关文章
06-18
06-17
最新文章
Android旗舰之王的过去与未来
智能手表不被开发、AR眼镜被推迟，Meta的产品经历了一波三折
为什么Cybertruck是特斯拉史上最难造的车？
更新鸿蒙3后，文杰允许你在车里做PPT了
新起亚K3试驾体验：追求“性价比”，韩系汽车仍不想放弃
阿维塔15登场！汽车配备了增程动力，理想情况下会迎来新的对手吗？
马斯克宣布创建 ChatGPT 竞争对手！ OpenAI的CEO给他泼了冷水， GPT-5可能会发生巨大变化
骁龙无处不在，是平台也是生态