项目考察点:
1、wx:for 循环的使用。 项目要求:
1、构建 WXML 模板。 wx:for 循环的使用index.js:
index.wxml:
由于循环结构通过 template 形成独立模板文件,因此 wxml 文件只需引入模板。{{images}} 为 js 文件data中的 images。imgItem 对应模板文件中的 name 属性。 模板template:
wx:for-item 指定当前项变量名,wx:for-index 指定数组下标变量。如果不指定 wx:for-item 和 wx:for-index,数组当前项的变量名默认为 item,默认数组的当前项的下标变量名默认为 index。(文档戳这:小程序列表渲染) 因此项目中 images[index] 可以用 item 代替。 template.wmxl:
项目要求通过 wxs 处理半角变全角逗号问题,引入 wxs 用法是,其中 tools 是 wxs 的名称,通过 module 定义。在{{tools.commaReplace(item.text)}}中,.commaReplace 由 wxs 定义,() 中传入 js 数据。 半角变全角逗号wxs: 在小程序中, 由于运行环境的差异,在 iOS 设备上小程序内的 wxs 会比 javascript 代码快 2 ~ 20 倍。 index.wxs:
使用 while 循环遍历字符串中每个字符的是否与半角逗号 , 匹配,如匹配使用 replace(",", ",") 方法替换,module.exports 输出模板数据供 wxml 调用。 旁白的显示与隐藏index.js:
在小程序里,想要更新页面的数据,必须使用 this.setData 对数据进行更新。 在知道数组下标或属性字段名称的情况下,可以这样写:
数组数据下标为动态数据时的取值方法: 项目中我采用的方式是给 aside 赋值,然后在 this.setData 中输出 [aside] 的方式。
还有另一种更高级的写法,使用 JSON. stringify 把要设置的数据进行序列化,或者使用字符串拼接的方法拼出 json ,然后再重新JSON.parse 传给 setData:
console.log(e) 调试技巧:立正小歪牙e.target 触发事件的组件的一些属性值集合,e.currentTarget 则是当前组件的一些属性值集合。 在不知道什么情况使用 e.currentTarget.dataset 还是 e.target.dataset 时,可以通过控制台打印 console.log(e) ,然后分别查看 .target 和 .currentTarget 来找到想要的属性值。
触发 toggleText 时的 console.log(e) 打印信息. |
微信小程序:漫画小程序项目总结
发布:2018-08-01 09:59浏览: 次来源:网络 作者:cola
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
相关文章
- 微信小程序app.json文件常用配置说明2021-07-09
- 微信小程序文字控制单行超过显示省略号2021-07-09
- 微信小程序参数传递的几种方法2021-07-09
- 微信小程序使用button按钮分享2021-07-09
- 微信小程序的setData2021-07-09
- 小程序分享,获取openid2021-07-08
- 微信小程序-实现tab2021-07-08
- 微信开发者工具新建和导入小程序2021-07-08
- 微信小程序实现点击拍照长按录像功能2021-07-08
- 微信小程序必知知识2021-07-08