小程序开发需要关注的几个知识点-j9九游会老哥俱乐部官网

内容主要涉及到小程序相关的五个方面。

　　1、text组件

　　2、单位（rpx）

　　3、生命周期

　　4、template模板

　　5、播放器插件

　　逐一来看一下。

　　一、text组件

　　小程序中view组件的使用相当于就是一个div标签，而text组件相当于就是一个文本标签b/span这样子，然而，其实一段文字我们可以使用text组件来包裹，也可以不用text组件而直接使用view组件来包裹，那二者有什么区别呢？

　　很明显，小程序给text组件赋予了特殊能力。而且使用text组件包裹文件更容易控制它的样式。所以，通过一些个对比和测试，我对text组件的认识就是两点：

　　1、用text组件包裹的内容好写样式，来控制它的显示ui。

　　2、在小程序中只有text包围的文本才可长按选中，这一点小程序给text组件赋予了一个属性。
　　二、单位rpx

　　谈一下我对rpx这个单位的认识， 小程序特有的一个单位。首先，小程序开发可以看成是一个移动web的开发。 竟然是一个移动端的开发，那么我们就应该用移动端的思维去写代码，就移动端有一些特殊的特征需要我们去考虑，比如：

　　1、最重要的！，如何在不同的机型上做适配。

　　2、模拟器ip6分辨率375和设计稿750的因为所以然关系。

　　这张图我已经在多个地方讲过了，通过这张图我们可以知道，模拟器ip6的375是一个逻辑分辨率的概念，单位可以认为是pt，它和我们日常布局中的css像素在数值大小上是同一个东西，而物理分辨率（如上750*1334）才是设备真正分辨率的概念，它和前面说的逻辑像素数值上有一个对应的关系（reader）。也就是表示一个逻辑像素包含几个物理像素问题。知道了这些之后，我们就来看一下小程序序里rpx那点事。

　　我们来看一下rpx的作用，看它解决了一个什么问题。

　　1、ip6下1px =1rpx=0.5pt

　　这里说的px指的是物理分辨率1px。这个就是小程序的规定，以ip6的物理像素750x1334为视觉稿进行设计，只不过小程序定了个不一样的单位叫rpx（responsive pixel）。然而，使用rpx，小程序会自动在不同的分辨率下进行转换。从而达到适配的效果。

　　小程序开发需要关注的几个知识点

　　可以理解：小程序中的rpx相当于就是移动端开发中px/rem/em等单位用来表示视觉上与设备分辨率上的一个逻辑关系 。

　　2、不是所有的单位都适合用rpx。

　　rpx是会根据不同机型去做自适应调整的，而有时候我们不需要去做这么一个调整。

　　比如，对于一些个文字介绍，使用rpx后，小屏幕看起来就完全不可控，显示效果上看着比较小，甚至出现看不清楚的情况，还有一些标题的情况，可能我们在任何机型上想要看到的就是一个加粗定大的效果。这种情况下，其实我觉得我们还是可以使用px作为单位来控制比较适合一些。

　　三、生命周期

　　小程序也有生命周期，其实整个开发流程和前端框架react/vue等都类似，所以，这个我对比着来看一下小程序中的生命同期的概念。

　　对于那些对外暴露的方法，onload/onshow/onready都好理解。在页面初始化数据的处理方式上有一点需要注意的地方：

　　1、在react框架

　　实际上跑完willmount之后会产生render，然后在执行didmount，如果在didmount中如果有数据发生变化，使用setstate处理变化后，再去执行render。

　　在willmount中我们可以使用this.state.xxx来初始化变量的值。

　　2、小程序架构

　　然而，在小程序的生命周期内，我们是否可以在onload中使用this.data.xxx来初始化变量呢？

　　答案是不行的，可能之前的版本是可以的，查了一下小程序文档。

　　四、template

　　wxml提供模板（template），可以在模板中定义代码片段，然后在不同的地方调用。

　　模板的使用非常简单，文档中的说的很清楚，那么关于这个清楚的描述，我对模板有两点认识：

　　1、区别于脚本引入可以使用绝对路径

　　脚本的引入是只能使用相对地址的，而模板的引入可以使用绝对路径。

　　2、模板化不是模块化

　　有没有发现在模板文件中其实少了一个文件，shipin-item-template.js，对，这里是不能加这个脚本文件的，所以从业务角度上来说，无法将逻辑单独出来。因此，小程序时原模板只是一个模板不是一个模块。

　　五、播放器插件

　　小程序插件功能是前端不久开放出来的，对于它的认识谈一下申请流程。