小程序开发中需要掌握的基本知识点

wx.jpg格式

最近，我在慕课上学习了“微信小程序的介绍与实践——通用组件API开发技能项目的实践”课程。com，并对小程序有了相对新的理解。我想分享我在课程中遇到的一些问题。

1.事件是否冒泡

事件分为冒泡事件和非冒泡事件

气泡事件：当组件上的事件被触发时，该事件将传递给父节点。

非气泡事件：当组件上的事件被触发时，该事件不会传递给父节点。

有时候，我们不想让事件泡泡，因为它会影响我们的效果。

小程序帮助我们解决这个问题。绑定事件绑定不会阻止冒泡事件向上冒泡，而捕获事件绑定可以防止冒泡事件向下冒泡。

//事件气泡

开启小程序之旅

//事件未冒泡

开启小程序之旅

如果您想知道哪些事件是气泡事件或非气泡事件，可以参考文档。

2.获取元素上的属性节点：currentTarget和target

了解两个属性：

CurrentTarget：事件绑定的当前组件。

目标：触发事件的源组件。

例如，我们为每个元素分配一个值。如下图所示，我们想要得到数据alpha-beta和数据alpha-beta。当我们想要获取当前元素的值时。

数据集测试

我们可以通过event.currentTarget.dataset获取它，

第页({

bindViewTap:函数（事件）{

事件当前目标数据集。AlphaBeta===1//-将改为驼峰书写

事件当前目标数据集。字母表===2//大写将转换为小写

}

})

但是，如果是以下情况：我们的事件写在swiper组件上，但我们想通过单击image获得上面的数据postId，我们需要使用event.target.dataset.posid。

<刷卡项目>

<；/图像>

<刷卡项目>

<；/图像>

Target指当前单击的组件，currentTarget指事件捕获的组件。这里的Target指图像，而currentTarget指刷卡器

3.底部选项卡的设置

选项卡.png

这相对简单。只需在App.json中配置相应的tabBar。

{

“页面”：[

“页面/索引/索引”，

“页面/日志/日志”

],

“选项卡栏”：{

“borderStyle”：“白色”，

“位置”：“底部”，

“列表”：[

{

“pagePath”：“pages/posts/post”，

“文本”：“阅读”，

“iconPath”：“images/tab/yuedu.png”，

“selectedIconPath”：“images/tab/yuedu_hl.png”

},

{

“pagePath”：“页面/电影/电影”，

“文本”：“电影”，

“iconPath”：“images/tab/dianying.png”，

“selectedIconPath”：“images/tab/dianying_hl.png”

}

]

}

}

4.尺寸单位：rpx

在小程序中，我们使用rpx而不是px。官方定义如下：

Rpx（反应像素）：根据屏幕宽度自适应。指定的屏幕宽度为750rpx。例如，在iPhone6 6上，如果屏幕宽度为375px，并且有750个物理像素，那么750rpx=375px=750个物理象素，1rpx=0.5px=1个物理象。

如果你想了解更多，可以参考。

5.图片转盘事件：刷卡

刷子.gif

<刷子

vertical=“｛｛false｝｝”

指示器点=“真”

autoplay=“真”

interval=“5000”

>

<刷卡项目>

<；/图像>

<刷卡项目>

<；/图像>

<刷卡项目>

<；/图像>

这将启用最简单的图片转盘。

上述切换器的一些特性：

垂直：滑动方向是否为纵向

指示点：是否显示面板指示点

自动播放：是否自动切换

间隔：自动切换间隔

您可以参考更多参数。

6.向上拉以加载，向下拉以刷新。

滚动.gif

上拉加载

如果使用