首页 > 程序开发 > 移动开发 > 其他 >

微信小程序开发思考总结—“文章阅读器和电影信息”项目实践---阅读首页、阅读详情开发

2017-04-17

微信小程序开发思考总结—“文章阅读器和电影信息”项目实践---阅读首页、阅读详情开发,在写这部分代码的时候,我用的是死数据,但后来发现数据填充的时候太凌乱,就模仿真实向服务器请求数据的模式,将所有数据提取到外面。

微信小程序开发思考总结—“文章阅读器和电影信息”项目实践

在写这部分代码的时候,我用的是死数据,但后来发现数据填充的时候太凌乱,就模仿真实向服务器请求数据的模式,将所有数据提取到外面,用数据绑定的方式在逻辑层获取数据;其中用到了小程序的模板templete组件,以及wxml里运用if循环和理解相对路径、绝对路径的区别,还有swiper组件的运用,各种点击事件的处理和交互。

post.wxml

这里写图片描述

1.微信小程序中的swiper组件真的是简单方便,提供了页面中图片文字等滑动的效果。

这里的就是一个滑块视图容器;而就是你希望滑动的东西,可以是文字也可以是image,其中swiper有很多属性。常用的有

属性名 默认值 作用

2.indicator-dots false 是否显示面板指示点

3.indicator-color rgba(0, 0, 0, .3) 指示点的颜色

4.indicator-active-color #000000 当前选中的指示点颜色

5.autoplay false 是否自动播放

6.intervaly 5000 自动切换时间间隔

这里vertical=”true”在官方文档中没有提到,定义这个可以上下滑动;还有一点需要注意vertical=”false”时,仍然是上下滑动,原因就是微信小程序在解析时将”false”看成字符串,只要字符串不为空,就为真。所以我们需要这样写:vertical=”{{false}}”

2.在组件上使用wx:for控制属性绑定一个数组,即可使用数组中各项的数据重复渲染该组件。(1)可以使用wx:for-item指定数组当前元素的变量名。(2)可以使用wx:for-index指定数组当前下标的变量名.(3)wx:for用在标签上,以渲染一个包含多节点的结构块。

3.绝对路径是指文件在硬盘上真正存在的路径。所谓相对路径,就是相对于自己的目标文件位置。相对路径使用“/”字符作为目录的分隔字符,而绝对路径可以使用“\”或“/”字符作为目录的分隔字符。

4、 Template模板

WXML提供模板(Template),可以在模板中定义代码片段,然后在不同的地方使用。可以保证格式以及数据的相同。

(1)-定义模板

使用标签定义模板,并将模板名称命名为tempName,赋值给属性name。在标签内部,定义模板结构。

(2)-使用模板

使用

相关文章
最新文章
热点推荐