移动端常用的效果图轮播、数据列表等都被小程序封装成了组件。 在这里我想和大家分享一下它们的使用方法。

-view 可滚动视图区域

图像轮播容器

链接到页面的 3 种方法

-看法

属性说明如下：

使用垂直滚动时，需要给出一个固定的高度，通过WXSS设置。 示例代码：

渲染：

当心：

提示：不要在 -view 中使用、映射和组件

提示：-into-view 的优先级高于 -top

提示：滚动-view时，会阻止页面反弹，所以在-view中滚动无法触发。

提示：如果要使用下拉刷新，请使用页面的滚动而不是-view，这样点击顶部状态栏也可以返回页面顶部

二，

物业描述：

注意：只有组件可以放置在那里，否则将导致未定义的行为。

-物品

只能放置在组件中，并且宽度和高度自动设置为100%。

代码如下所示：

JS代码：

// pages/test1/test1.js Page({ data:{ wxTitle:"微信程序", alertInfo:"登录成功了", isShow:false, imgUrls: [ "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1489225534462&di=009148115f436101d6377305b2f660ef&imgtype=0&src=https://www.2cto.com/uploadfile/2018/0519/20180519105145728.jpg",' ], indicatorDots: true, autoplay: true, interval: 5000, duration: 1000 }, changeIndicatorDots: function(e) { this.setData({ indicatorDots: !this.data.indicatorDots }) }, changeAutoplay: function(e) { this.setData({ autoplay: !this.data.autoplay }) }, intervalChange: function(e) { this.setData({ interval: e.detail.value }) }, durationChange: function(e) { this.setData({ duration: e.detail.value }) } })

效果如下：

页面链接

物业描述：

a.open-type="" 打开新界面

b.open-type=""在此界面中打开一个新界面

c.open-type="" 控制标签页之间的切换

注意：

所有需要跳转链接的接口都必须在app.json中注册a,b只能连接未注册占用的页面，无法打开url="..//"，因为//接口是tab页，c可以只需打开app.json中注册的标签页就是注册的接口。

代码如下所示：